Question

我无法将点击的元素的值传递给ajax函数。下面是ajax函数。

// Get values from all three dropdown menus
        var state = $('#states').val();
        var status = $('#status').val();
        var services = $('#services').val();
// Get value from clicked element
        var pagedtest = pagednum;

function do_ajax() {
            $.ajax({
                url: ajaxurl, 
                data: {
                    'action' : 'json_info2',
                    'state' : state,
                    'status' : status,
                    'services' : services,
                    'pagedtest' : pagedtest
                },
                success:function(moredata) {
                    // This outputs the result of the ajax request
                    $('#project-list').html( moredata );
                    $('#project-list').fadeIn();
                }/*,
                error: function(errorThrown){
                    var errorMsg = "No results match your criteria";
                    $('#project-list').html(errorMsg);
                }*/
            }); // end of ajax call
        } // end of function do_ajax

然后假设我有一系列标签，每个标签都动态分配标题，如下所示：

<a title="90" class="page-link">90</a>
<a title="87" class="page-link">87</a>
<a title="102" class="page-link">102</a>

我正在尝试在我的php页面中运行以下代码，以便获取点击的值以传递给ajax。

$(".page-link").click(function() {
      var pagednum = $(".page-link").val($(this).attr('title'));
      return false;
});

当我点击其中一个链接时，没有任何反应。我哪里错了？

当ajax函数运行时，如何传递clicked标签的title属性值？

Answer 1

试试这个：

 $(".page-link").click(function() {
       var pagednum = $(this).attr('title');
 });

另外，请确保您的锚标记具有href属性。

Answer 2

我不确定javascript的这两个部分之间的关系是什么，但似乎您在第一部分中尝试使用pagednum。

但是，您在点击处理中定义的pagednum如下所示：

$(".page-link").click(function() {
      var pagednum = $(".page-link").val($(this).attr('title'));
//    ^^^ defining a variable in the local scope
      return false;
});

当您使用var关键字单击处理程序声明变量时，该变量的范围是该函数的本地，即单击处理程序。

如果你需要一个全局变量，那么应该全局声明它（在任何jQuery函数之外），如：

var pagednum;
// rest of scripts, functions, etc.

然后你在点击处理程序中使用它，如：

$(".page-link").click(function() {
      pagednum = $(".page-link").val($(this).attr('title'));
//    ^^^^^^^^ use global variable
      return false;
});

有关详细信息，发布完整的脚本以便我们了解所有相关内容会很有帮助。

Answer 3

希望这篇文章能够澄清我上面提到的内容，以及它是如何解决的。

我有一个php页面，在那个页面上我有几个具有title属性的元素。我最初使用标签，但我决定改用li。所以我在我的php页面上有这些：

<li title="87" class="page-link">Click this 87</li>
<li title="2" class="page-link">Click this 2</li>
<li title="34" class="page-link">Click this 34</li>

我想要做的是点击那些li，获取标题值，将其保存为变量，并将其传递给ajax函数。我最初尝试包含一个jquery点击功能（在我的PHP页面中）来获取值。我能够成功获得点击的价值，但我仍然无法将其传递给ajax函数。

所以相反，我去了我的ajax函数（它位于一个名为ajaxLoop.js的外部js文件中）。在js文件中，我添加了以下内容：

// make pagination clickable after filter
        $( ".page-link" ).click(function() {
            var pagednumtest = $(this).attr('title');
            alert("the set number is "+pagednumtest);
            run_ajax();
        }); // end of click function for states

这成功获取了click的值，因为警报能够输出它，但我仍然无法在实际的ajax函数中访问var pagednumtest。事实上，ajax函数不会运行，因为它没有识别我试图传递的变量。所以我通过将变量传递给ajax函数来修改上面的函数，如下所示：

我改变了

run_ajax();

到这个

run_ajax(pagednumtest);

所以整个函数看起来像这样：

// make pagination clickable after filter
        $( ".page-link" ).click(function() {
            var pagednumtest = $(this).attr('title');
            alert("the set number is "+pagednumtest);
            // variable is passed to the ajax function
            run_ajax(pagednumtest);
        }); // end of click function for states

然后ajax函数接受了变量值，我就可以使用它了。

function run_ajax(mynumber) {
// Get values from all three dropdown menus
        var state = $('#states').val();
        var markets = $('#markets').val();
        var services = $('#services').val();
        var mytestnumber = mynumber;
            $.ajax({
                url: ajaxurl, 
                data: {
                    'action' : 'json_info2',
                    // ignore state, markets, and services as they are dropdown menu values
                    'state' : state,
                    'status' : markets,
                    'services' : services,
                    // here I was able to get and use the clicked value
                    'testnum' : mytestnumber
                },
                success:function(moredata) {
                    // This outputs the result of the ajax request
                    $('#project-list').html( moredata );
                    $('#project-list').fadeIn();
                }/*,
                error: function(errorThrown){
                    var errorMsg = "No results match your criteria";
                    $('#project-list').html(errorMsg);
                }*/
            }); // end of ajax call
        } // end of function do_ajax

麻烦将点击值（PHP）传递给ajax函数

3 个答案: