Question

我正在使用jQuery ajaxSuccess。

我有一个预加载的HTML。

我的jQuery代码是：

abc();

function abc() {
$('.clickme').click(function() {
alert('');
// some ajax code and it will give some html //
});
 $('.secondClass').click(function()  {
     //some ajax code///

  });

}

以上代码全部在文档就绪功能中。现在，当我使用ajaxSuccess函数时：

$(document).ajaxSuccess(function( event, request, settings ) { abc(); }

现在当我点击.clickme类时，它正在向服务器发送多个请求。

如何解决这个问题？

Answer 1

这是因为每当发出ajax请求时，你都会向目标元素添加一个新的处理程序。

我认为你这样做是为了处理动态添加的元素，为此而不是使用ajax回调使用event delegation

jQuery(function () {
    $(document).on('click', '.clickme', function () {
        alert('');
        // some ajax code and it will give some html //
    });
    $(document).on('click', '.secondClass', function () {
        //some ajax code///

    });
})

在这种情况下，不需要abc方法。

演示：Problem，Solution

Answer 2

无需在方法abc（）中编写单击事件。只需直接写在文档内部。这足以实现你想要实现的目标

 $(document).ready(function() {
     $(document).on('click', '.clickme', function() {
         alert('');
         // some ajax code and it will give some html //
     });
     $(document).on('click', '.secondClass', function() {
         //some ajax code///

     });
 });

这不会触发多个请求..希望有所帮助

jQuery ajaxSuccess

2 个答案: