Question

该文档包含2个具有相同类的元素，一个是从页面的初始加载中呈现的，另一个是稍后添加的ajax调用。

在我的js代码中我正在做：

 $(document).on('click', '.some-class', function(e) {
     some code
 });

问题在于这两个元素都是“点击”事件

我尝试在处理程序中添加e.target == this检查，但它不起作用。

Answer 1

如果我猜对了，你想避免事件传播。尝试：

$(document).on('click', '.some-class', function(e) {
     e.stopPropagation();
    //Your code
 });

Answer 2

如果您只想点击第一个元素，请使用以下代码

$('.some-class').on('click', function(e) {some code});

因为此代码不适用于在DOM中动态插入的元素。

Answer 3

您将不得不找到区分这两个元素的方法。

如果可能的话，区分这两者的最简单方法是让ajax调用使用额外的类添加元素，如.extra。然后你可以使用$（document）.on（'click'，'。some-class.extra'，function（e）{some code}）;

如果你不能在ajax中添加额外的类，那么你必须找到一种更有创意的方法来区分这两者。例如，如果其中一个元素位于具有类.parent的div的后代中，请使用$（document）.on（'click'，'。parent .some-class'，function（e）{some code} ）;

如果没有一种简单的方法可以通过布局区分它们，您可能必须非常棘手。例如，如果您感兴趣的元素是div中的第二个元素，而另一个元素是第一个，您可以使用$（document）.on（'click'，'。some-class：nth-child（ 2）'，function（e）{some code}）;

查看“Css Selectors”以了解您可以选择所需元素的方法。