Question

＆＃13;

$( document ).ready(function() {

  $('#handler').on('click', '.selector', function(){
    alert( $(this).text());
  });
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="handler">
  handler content
  <a href="#" class="selector">selector content</a>
</div>

＆＃13;

如何在未明确指定#handler方法的情况下获取on？

Answer 1

使用事件＆＃34; delegateTarget＆＃34;属性

$( document ).ready(function() {
    $('#handler').on('click', '.selector', function(e){
        console.log(e.delegateTarget);
    });
});

工作示例： -

＆＃13;

$( document ).ready(function() {
  $('#handler').on('click', '.selector', function(e){
      console.log(e.delegateTarget);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="handler">
  handler content
  <a href="#" class="selector">child</a>
  <div>
    <a href="#" class="selector">grand child</a>
  </div>
  <div>
    <div>
      <a href="#" class="selector">great grand child</a>
    </div>
  </div>
</div>

＆＃13;

Answer 2

在这种特定情况下，您可以直接使用您拥有的唯一ID

$("#handler").

如果是一个班级，你可以$(this).parent()到顶级。

你可以将它链接到第n级，直到你到达顶部。 $(this).parent().parent() ...

或者由于你知道选择器，你可以$(this).parents("selector")

Answer 3

如果父级具有层次结构，则使用closest()

$(this).closest('div')

如果它是目标元素的直接父项，则使用parent()

$(this).parent('div');

选择器是唯一的，其ID为handler，那么最好的选项是

$('#handler')

Answer 4

将其更改为

.selector

或者如果您仍然希望在有人点击$( document ).ready(function() { $('#handler').on('click', '.selector', function(){ var handler = $(this).parent(); }); });时触发该功能，那么您可以执行以下操作

{{1}}

在（）方法中获取处理程序

4 个答案: