jquery代码里面.ajaxComplete发生多次，但应该只做一次

Question

我有4个页面加载函数，自动加载数据库中的数据，填充数据库中的ajax后在一个div（对于每个函数，我有一个div）用户向下滚动。现在在这个收到的htmldata我想要一个onclick事件，并做一些更多的ajax后操作来操纵一些数据并显示更改。

但是当我使用

$(document).ajaxComplete(function() { 
$("#clickelement").click(function(){ 
//do some ajax post here and fill a div with the received data 
}); 

点击功能的executet 4倍（因为之前已经有4周阿贾克斯后的行动。当我再次单击其executet 5倍（我认为的onclick里面的阿贾克斯行动触发也.ajaxComplete），另外当我向下滚动加载更多的数据其执行甚至更多..我怎么能绕过这一点，并激发.click只有一次，并具有点击功能活动的所有#clickelement divs内的自动加载的HTML ？

Answer 1

好吧，我现在解决了这个问题对于那些有兴趣谁：

$('#divwhichisfilledwithajax').on('click', '#clickelement', function() { 
//do what the click on the #clickelement should do 
}); 

香港专业教育学院搜查了一会儿，发现我可以使用委托的事件侦听器。我认为这种方法会在每次AJAX调用之后堆积听众，因为我不是只针对新元素，而是针对以前的所有元素。另外它只会触发一次。由于听众只添加到适合参数#clickelement

简单干净:)

Answer 2

您正在将代码添加到全局ajaxComplete事件中，这意味着它将无线只要ajax调用完成，就会被调用。

ajaxComplete（全局事件） 此事件的行为与完整事件相同，并且每次Ajax请求完成时都会触发。 Docs

Better docs

什么你可能寻找的是success或complete回调这是当地事件（只在特定的ajax调用解雇），并使用这样的：

$.ajax({ 
    type: "GET", 
    data: {}, 
    dataType: 'text', 
    contentType: "application/json", 
    url: APP_URL + '/extension/ad/get-user-attributes/' + email, 
    success: function(response) { 
    // fires when THIS ajax request returns successfully 
    }, 
    error: function(xhr, status, error) { 
    // fires when THIS ajax request returns an error 
    }, 
    complete: function(xhr, status) { 
    // fires when THIS ajax request completes (after success or error) 
    } 
}); 

对于complete和success之间的差异see this other answer