JQuery无限滚动加载多个相同的$（document）.ready事件，并多次激发它们

我是jquery新手，希望这是一个简单的问题，但我已经没有想法了

我正在使用.net，有一个页面包含一些自定义jquery函数，如下所示，用于跟踪用户。当页面第一次加载时，这种方法工作得非常好

这个问题伴随着无限滚动而来，在这里我发布到另一个页面并附加结果。如果我附加结果而没有在发布的页面上重新包含下面的函数，当我单击新附加的链接时，它将永远不会触发事件。但是，如果我再次包含这个完全相同的片段，它将正常工作。除了页面上所有以前的链接现在都会触发额外的时间

因此，如果我向下滚动5页数据，然后单击页面上的第一个链接，它现在会触发6次！！我添加的最新版本只触发一次

我看到了一些关于去抖动和节流的东西，但这似乎比那更简单——难道没有一种方法可以只加载这个函数一次并让它对附加的数据起作用吗

$(document).ready(function () {

   $('a.FollowJQ').click(function () {

     var username = $(this).attr('data');

     $.post('/jquery/follow.aspx',{ user: username },

       function (data) {

          if (!data.error) {

           if (data.server == 'SendToLoginPage') { window.location = "/login.aspx" }

              else { $('a.FollowJQ:[data=' + username + ']').html(data.server); }  }

                    else { $('a.FollowJQ:[data=' + username + ']').html(data.server); }

                        }, 'json');
                });
        });

---

您需要使用

.click（）

，而不是使用

.on（）

（jQ 1.7以后）来委托祖先元素作为侦听器。绑定一次，然后任何“

a.FollowJQ

”都可以执行该函数

$('#wrapper').on("click", "a.FollowJQ", function() { ..the function.. });

如果使用jQuery 1.6.x，.delegate（）将执行相同的操作：

$('#wrapper').delegate("a.FollowJQ", "click", function() { ..the function.. });

---

在示例中，

“#wrapper”

是

“a.FollowJQ”

元素的任何祖先元素，这些元素预计不会被任何其他DOM操作破坏。最接近的共同祖先会有最好的表现。

你好，格雷格，谢谢你的回复。这是有道理的，但我在实现它时遇到了困难。我不清楚这是否只在原始页面上存在一次，或者是否仍然需要在“发布到”页面上添加？也就是说，原始页面是否仍有$（'a.FollowJQ'）。单击（函数，然后只有“发布到”页面才有$（'FollowWrapper'）。单击（“单击”，“a.FollowJQ”，函数）？或者你是说我只需要将此添加到原始页面，发布的页面就会找到它？非常感谢你的帮助！我很高兴听到这是一个常见的需求：）这完全取代了原来的.click（）绑定。上面的绑定只在“主页”上调用一次，其中“#wrapper”被任何在加载发布页面时不会被破坏的祖先元素所替换。如果你非常绝望，它甚至可能是“body”，但如果可能，最好深入一点。因此“#wrapper”实际上是侦听器；当您单击任何a.FollowJQ时，即使是后来添加的a.FollowJQ，#wrapper也可以“听到”单击。术语“祖先”表示您的a.FollowJQ需要是子女、孙子、曾孙（等）当然是#wrapper。非常感谢Greg！这正是我所缺少的。现在我只需在我的基本页面中放置一个位置就可以让它全部正常工作。太棒了！非常感谢您的帮助和精彩的解释！双手竖起大拇指指向手指手枪并发出“咔嗒咔”的声音效果（没问题！）