无法从单击事件调用函数 - Cannot call function from click event

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

在我的PHP脚本中，我将分页链接放在一起，每个锚点都有一个"href='#'"answers"linkValue'"的属性，该属性的值被动态设置为相应的页码。PHP生成以下HTML:

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

例如，当点击"linkValue=2"的链接时，该值将传递给jquery函数，并连接到查询字符串的末尾：

'getParts.php?pageNum=2'.

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

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

它又调用PHP脚本"getParts.PHP".

问题在于：我似乎无法从分页链接的单击事件中调用"showParts（）"函数。我可以很容易地调用一个简单的警报，我甚至可以调用一个包含警报的函数，但当尝试调用showParts函数时，我只会在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();
}

看起来您更改了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');
        });
    });
});