识别jQuery中被点击目标的子元素 [英] Identifying a child element of a clicked target in jQuery

问题描述

我试图弄清楚如何右键单击表中的任意位置，该位置在tr标记上具有事件侦听器，并将click()命令向下传递给子级button./p>

 jQuery(".catcher").contextmenu(function (e) {
    e.target.**FIND CHILD BUTTON**.click();
}); 

 table {
  border: 1px solid red;
  width: 200px;
  height: 200px;
} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="catcher">
    <td>
      <span>
          <button onclick="alert('it works!');">Button</button>
      </span>
    </td>
  </tr>
</table> 

解决方案

您需要使用jquery find方法，以便在任意深度搜索第一个子实例

 jQuery(".catcher").contextmenu(function(e) {
  $(this).find('button').click();
  return false;
}); 

 table {
  border: 1px solid red;
  width: 200px;
  height: 200px;
} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="catcher">
    <td>
      <span>
          <button onclick="alert('it works!');">Button</button>
      </span>
    </td>
  </tr>
</table> 

I'm trying to work out how I can right-click anywhere in the table, which has an event listener on the tr tag, and will pass the click() command down to the child button.

jQuery(".catcher").contextmenu(function (e) {
    e.target.**FIND CHILD BUTTON**.click();
});

table {
  border: 1px solid red;
  width: 200px;
  height: 200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="catcher">
    <td>
      <span>
          <button onclick="alert('it works!');">Button</button>
      </span>
    </td>
  </tr>
</table>

解决方案

You need to use jquery find method wich searches for first child instance at any depth

jQuery(".catcher").contextmenu(function(e) {
  $(this).find('button').click();
  return false;
});

table {
  border: 1px solid red;
  width: 200px;
  height: 200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="catcher">
    <td>
      <span>
          <button onclick="alert('it works!');">Button</button>
      </span>
    </td>
  </tr>
</table>

这篇关于识别jQuery中被点击目标的子元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！