如何使用event.stopPropagation将选择器作为数据参数传递给.on（）？

Question

我目前使用event.stopPropagation（）来处理几个选择器，但现在我需要将这些选择器作为参数传递给.on（），因为这些元素在ajax请求之后被替换。

这就是我拥有和工作的东西（但是当ajax替换了选择器元素时会中断）：

$('.addSetMenu input, .addSetMenu select, .addSetMenu').on('click', function(event) {
    return event.stopPropagation();
});

我正在尝试将选择器作为参数传递给.on（）作为数据，因为ajax请求替换了所有这些元素，但它似乎没有正常工作：

   $(document).on('click', '.addSetMenu input, .addSetMenu select, .addSetMenu', function(event) {
     return event.stopPropagation();
  });

Answer 1

在第二个代码示例中，您无法将stopPropagation()与委派事件处理相结合。这是因为委托事件处理使用事件传播才能工作。因此，当您的事件冒泡到文档对象（它将由事件处理程序处理）时，它已经传播，因此您无法停止已经发生的传播。

这里的真正解决方案可能是了解你真正试图阻止的内容。如果您确实需要停止事件传播，那么每次使用ajax替换内容时都必须重新绑定第一类事件处理程序（注意不要获取任何重复的事件处理程序）。但是，如果我们通过stopPropagation()电话知道您真正想要阻止的是什么，我们可能会提供更简单的解决方案。

根据您的pasteBin示例判断，我看到了三种可能性：

1. 更改代码以处理点击次数并将stopPropagation更改为关闭处理程序之前的公共父级。这可能是更好的解决方案，但我必须更多地了解您的HTML结构以及使用ajax动态加载的内容，以了解这是否可行，以及确切的代码将起作用。
2. 在您的关闭处理程序（pasteBin示例中的代码）中，检查实际的点击目标，如果目标是选择器中的某个项目，则不要调用resetMenu()。您可以在事件目标上使用.is()方法来确定。
3. 每次通过ajax重新加载内容时，请使用静态版.on()（您的第一个代码示例）重新安装事件处理程序。