Question

我有一个汽车零件分类部分，我想每页只显示10个广告和底部的分页链接。我看到的每个PHP分页示例都将php代码放到显示数据的同一页面中......我不想这样做。我希望所有内容都通过jquery和AJAX，并使用XMLHttpRequest来推送页面上的数据。

在我的PHP脚本中，我将分页链接放在一起，每个锚点的属性为＆＃34; href =＆＃39;＃＆＃39;＆＃34;和＆＃39; linkValue＆＃39;谁的值是动态设置为它的相应页码。 PHP生成此HTML：

<a class="paginateLink" linkvalue="2" href="#""></a>

例如，点击链接时使用＆link; linkValue = 2＆＃39;该值传递给jquery函数并连接到查询字符串的末尾：

'getParts.php?pageNum=2'.

PHP脚本从查询字符串中获取pageNum的值，并使用它来确定返回哪个页面，在此示例中，它将返回记录11-20。零件分类页面最初通过函数调用加载到“showParts（）”。在头上：

$(document).ready(showParts() );

反过来调用PHP脚本＆＃39; getParts.php＆＃39;。

问题在于：我似乎无法打电话给'showParts（）＆＃39;来自分页链接的click事件的功能。我可以很容易地调用一个简单的警报，我甚至可以调用一个具有警报的函数，但是当我尝试调用showParts函数时，我只能得到＃＆＃39;＃＆＃39;在url addy的末尾，然后转到页面顶部。

jquery函数：

$(document).ready(function(){
    $(".paginateLink").click(function(){
        showParts();
    });
});

此时我甚至没有尝试将查询字符串放在一起，只是想得到它以便函数首先触发，即使它只是发回相同的结果。

编辑：不知道我在这里做错了什么，这似乎应该有效。例如，以下代码有效：

$(document).ready(function(){
    $(".paginateLink").click(function(){
        alert($(this).attr('linkValue'));
    });
});

所以我可以调用一个函数并传递必要的变量，我只是不能调用showParts函数，至少不是第二次。当页面最初加载以使用汽车零件填充页面时，再次调用该函数。

function showParts(str) {
    if (str=="") {
        document.getElementById("partsDisplay").innerHTML="";
        return;
    }
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {  // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("partsDisplay").innerHTML=xmlhttp.responseText;
            $(document).foundation('accordion', 'reflow');
            $(document).foundation();
        }
    }
    xmlhttp.open("GET","PHP/getParts2.php",true);
    xmlhttp.send();
}

Answer 1

看起来您更改了dom中的分页元素，因此删除了click事件。所以，你最好使用：

$(document).ready(function(){
    $("body").on("click", ".paginateLink", function(){
        showParts();
    });
});

这意味着，无论您是删除分页，还是再次插入分页，只要您单击主体并且目标是导航链接，它就会触发该事件。如果使用较旧的jQuery，则live是等效的方法。

发现了另一个错误，您使用：

if (str=="") {
   document.getElementById("partsDisplay").innerHTML="";
   return;
}

这是错误的，因为稍后你会在没有参数的情况下调用函数。它应该是：

if (typeof str === "undefined" || !str) {
   document.getElementById("partsDisplay").innerHTML="";
   return;
}

但是，既然你使用了jQuery，那就不会更容易了：

$(document).ready(function(){
    $("body").on("click", ".paginateLink", function(e){
        e.preventDefault();
        $('#partsDisplay').load('PHP/getParts2.php?pageNum=' + $(this).attr('linkvalue'), function() {
            $(document).foundation('accordion', 'reflow');
        });
    });
});

无法通过点击事件调用函数

1 个答案: