Javascript Jquery事件，简单的点击，如何以及为什么？

因此，我在页面（表）上有一些数据，这些数据基于其他地方的一些选项，可能会从服务器上重新加载ajax。 此表中有一些按钮，可以单击这些按钮使表中的记录发生其他事情

我注意到这。。。 ... 是将简单事件处理程序附加到元素的推荐方法，但只附加到当前存在的元素，并且在执行ajax加载时，会丢失附加的处理程序

所以我开始用这个。。。猜猜看，jquery团队做了他们惯常的做法，并反对使用它，说我应该使用“on”

这些函数的行为非常不同，但jquery文档说我应该交替使用它们，以便

有人能解释一下这个“on”的等价物吗？在ajax调用替换以前附加到的元素之后，我如何让它与元素一起工作

 $("some selector").live('click', function (e) {
            // some code code
            e.preventDefault();
            return false;
        });

我的理解是你会做一些像

 $("some selector").on('click', function (e) {
            // some code code
            e.preventDefault();
            return false;
        });

我的猜测是，在执行ajax调用之后，我必须重新运行这段代码，将其放入某种“initClicks”函数中，并在页面加载和ajax调用之后调用它

---

这对我来说似乎有点倒退。。。还是我错过了什么？

与所说的

live

相当的是

$(document).on('click', "some selector", function (e) {
    // some code code
    e.preventDefault();
    return false;
});

是所有事件处理程序格式的单站，您使用的模型与

$("some selector").click(function (e) {
    // some code code
    e.preventDefault();
    return false;
});

---

它执行基于工作的事件委派。

与所述的

实时

等效的是

$(document).on('click', "some selector", function (e) {
    // some code code
    e.preventDefault();
    return false;
});

是所有事件处理程序格式的单站，您使用的模型与

$("some selector").click(function (e) {
    // some code code
    e.preventDefault();
    return false;
});

---

它执行基于事件的委派。

由于元素是动态添加的，因此需要使用来注册事件处理程序

// New way (jQuery 1.7+) - .on(events, selector, handler)
$(document).on('click', 'some selector', function(event) {
    // some code code
    e.preventDefault();
    return false; 
});

另外，使用或

返回false

，如下所示：

return false = e.preventDefault() + e.stopPropagation()

---

因此，不需要同时使用这两个元素。

因为元素是动态添加的，所以需要使用来注册事件处理程序

// New way (jQuery 1.7+) - .on(events, selector, handler)
$(document).on('click', 'some selector', function(event) {
    // some code code
    e.preventDefault();
    return false; 
});

另外，使用或

返回false

，如下所示：

return false = e.preventDefault() + e.stopPropagation()

---

因此，不需要同时使用它们。

您永远无法将事件侦听器附加到DOM中尚不存在的元素。

live

和

on

方法所做的是将侦听器附加到当前存在的父对象上

live

只不过是附加在

文档本身上的
。
您永远无法将事件侦听器附加到DOM中尚不存在的元素。
live
和
on
方法所做的是将侦听器附加到当前存在的父对象上
live
只不过是
文档本身上附加的
。
live（）
不是魔法，它看不到未来的元素，它所做的是将侦听器附加到页面
文档的第一个根元素上，并检查每个冒泡事件是否与目标选择器匹配，当它找到匹配项时，它会执行你的函数

这叫做

live（）
被弃用是有充分理由的，主要是因为使用它会影响性能

随后，jQUery团队引入了
delegate（）
函数，它为我们提供了一种新的方法来实现精确的结果，但它非常巧妙地解决了性能问题，它将侦听冒泡事件的范围限制在了您现在和未来元素可能最接近的父元素

当他们引入
On（）
函数时，您可以将其用作普通事件处理程序，或者用作未来元素的委托处理程序

因此，我相信他们在这方面做得很好，让我们能够根据具体情况灵活地使用它

代码示例：

使用
委托（）
：

使用（）上的
（用于委托事件）

这两种方法都是相同的，并且将处理将来在
a
上的单击，这将在将来添加到
TARGET\u ID
元素中

TARGET\u ID
是将ID用于选择器的示例，但您可以根据具体需要使用任何选择器。
live（）
不是魔术，它看不到未来的元素，它所做的是将侦听器附加到页面
文档的第一个根元素，并检查每个冒泡事件是否与目标选择器匹配，当找到匹配项时，它将执行您的函数

这叫做

live（）
被弃用是有充分理由的，主要是因为使用它会影响性能

随后，jQUery团队引入了
delegate（）
函数，它为我们提供了一种新的方法来实现精确的结果，但它非常巧妙地解决了性能问题，它将侦听冒泡事件的范围限制在了您现在和未来元素可能最接近的父元素

当他们引入
On（）
函数时，您可以将其用作普通事件处理程序，或者用作未来元素的委托处理程序

因此，我相信他们在这方面做得很好，让我们能够根据具体情况灵活地使用它

代码示例：

使用
委托（）
：

使用（）上的
（用于委托事件）

这两种方法都是相同的，并且将处理将来在
a
上的单击，这将在将来添加到
TARGET\u ID
元素中

TARGET\u ID
是为选择器使用ID的一个示例，但您可以根据具体需要使用任何选择器。
当您使用
时，在（'click'，function（e）{}）
函数上，它仅适用于现有元素。
要处理所有
选择器
元素上的单击事件，即使是将来要添加的元素，也可以使用以下功能之一：

$(document).on('click', "some selector", function (e) {
    // some code code
    e.preventDefault();
    return false;
});

或：

有关更多信息，请阅读有关使用
.on（'click'，function（e）{}）时使用
的文章