javascript - JQuery.on事件等函数

Question

由于 .live() 已被弃用，我开始使用 .on()。

我有以下代码:

$('.myClass').on("click", function(event)
{
    var args = '......';

     SendAjax(args);
});

SendAjax 函数执行此操作:

SendAjax(args)
{
    $.ajax(
    {
        type: "POST",
        url: webPageName,
        data: queryParams+'&'+unique,
        success: function(result)
        {
            MyReturnFunction(result);
        }
    });
}

ajax 将返回此函数:

MyReturnFunction(response)
{
      $('.myClass').html(response);
}

但是在这个 MyReturnFunction() 之后，.myClass 上的事件不再起作用。如何使用 .on() 或 .bind() 解决此问题？

Answer 1

.on()函数可以接受一个额外的参数:

$('body').on('click', '.myClass', function() { ... });

这就是.live()为你做了，但它是一个向后的 API 设计。现在您必须决定将委派的处理程序放在哪里。 body 元素是一个很好的默认值，但它可以是任何父元素。有时，当您处理表格中的点击时，最好在 <table> 处进行绑定(bind)。元素(尽管 body 也能正常工作)。

所以基本上规则是当你过去写:

$('something').live('event-name', function() { ... })

你写:

$('container-selector').on('event-name', 'something', function() { ... })

“容器选择器”表示您希望放置真实 事件处理程序的位置——检查冒泡事件的目标是否与给定的“某物”选择器匹配的处理程序。和以前一样，您可以传递一个事件名称列表(以空格分隔)，而不仅仅是一个。还有一个变体允许您将对象映射事件名称传递给函数。