Jquery 无限滚动后点击事件不起作用

Question

我正在使用 cakephp 框架和 jquery infinitescroll 插件来动态加载内容。每个 post 都有一个 link 和一个 ajax 动作。

当加载页面时，有 5 posts，ajax links 工作正常。但是当使用 infitescroll (ajax) 加载 5 个其他 post 时，ajax link 不工作。

看起来 ajax 函数找不到 link 的 id 但我没有找到解决方案。

 <a href="/questions" onclick="return false"><i class="glyphicon glyphicon-circle-arrow-right" id="581617"></i></a>

<script type="text/javascript">
 $(document).on("click","#581617",function(){
        $.ajax({url: "the_url", 
                    type:'post',
           })   });
    </script>

更新：根据@ZacharyKniebel 的解决方案进行更改后，我尝试编写我的选择器以使用下面的 ID 附加到 links，但这是行不通的。谁能告诉我为什么？

"a > i.glyphicon.<?php echo $linkId;?>"

Answer 1

您似乎只为 ID 为 #581617 的元素委派了您的处理程序。相反，尝试委托您的处理程序更广泛地查找您的 a > i.glyphicon.glyphicon-circle-arrow-right 元素：

$(document).on("click","a > i.glyphicon.glyphicon-circle-arrow-right",function(){
    $.ajax({
        url: "the_url", 
        type:'post'
    });   
});

作为旁注，为了 IE 的功能，在上面我还删除了 type:'post' 之后的尾随逗号。虽然保留尾随逗号在技术上是有效的，但 IE 不太喜欢它。

更新：

关于您现在尝试使用的选择器，请注意，如果您通过 ID 选择它们，则无法让选择器对所有新加载的 link 起作用。从技术上讲，有一些变通办法可以做到这一点，但它们非常脏，而且性能很差。这是因为 ID 是唯一的，通过 ID 绑定此处理程序就像尝试分别绑定到每个 link，而不是一次绑定到所有 link。（从技术上讲，因为这是一个委托处理程序，所以您并没有真正绑定到 link，但您正在监听它们）。

简而言之，上面我给你的选择器就是你想要用来让你的事件处理程序监听所有这些选择器的东西。

Jquery 无限滚动后点击事件不起作用

Jquery on click event not working after infinitescroll

php

ajax

jquery

cakephp