javascript - Javascript：事件重复

Question

我无法弄清楚我的代码有什么问题。我有几个全局变量，每次按下某个按钮时我都会更改它们，还有几个自定义函数执行 ajax 调用，这些函数返回一段带有下面分页的 html 代码，其工作方式如下：

    $('#foot #pagination a.page').live('click', function(){
        window.mode = 'partial';        
        window.key = $('input#search').val();           
        window.page = $(this).parent().find('input').val();
        setTimeout('getData();', 0);        
    });

有时当移动到另一个页面时，事件加倍，我得到了加倍的 html。调用 getData() 时；从浏览器控制台 - 一切正常，就像它必须工作一样。什么会导致这种情况？

Answer 1

问题是jQuery.live()在文档就绪时将一些数据推送到jQuery堆栈，但是在ajax响应来自服务器并且再次调用文档就绪事件之后 - 在这种情况下.live()再次将相同的数据推送到jQuery堆栈，然后导致多个事件主体来电。

我以前用过.die()，.live()现在一切正常。

Answer 2

您应该只在 之后执行此函数一次document.ready。或者做这样的事情：

$('#foot').off('click', '#pagination a.page', navigation) // remove event
          .on('click', '#pagination a.page', navigation); // add event

function navigation(e) {
   window.mode = 'partial';        
   window.key = $('input#search').val();           
   window.page = $(e.currentTarget).parent().find('input').val();
   setTimeout('getData();', 0);        
});