Question

如何在省略其中的某些元素的同时选择容器？

我正在尝试使html表的单元格可单击，但这些单元格中的div不能跟随click事件。这些div可能有链接。我将选择器设置如下，单元格内的所有内容都是可点击的。

 $('table').on('click', 'tr td', function(){
            alert('clicked');
 })

现在，我将选择器更改为不在元素td中包含div，但这不起作用：单元格的任何部分都不响应任何单击。

 $('table').on('click', 'tr td :not(div)', function(){
            alert('clicked');
  })

这是小提琴：https://jsfiddle.net/fo1eL8tb/

如何使单元格可单击，而不是单元格中的div。如果可能的话，我想避免停止传播，因为单元格中的div可以有其他事件侦听器。

修改

HERE就是我想要的一个例子。父对象中的div不在click事件中。

Answer 1

如何在省略其中的某些元素的同时选择容器？

那是不可能的。 DOM是树结构。如果选择一个节点，则通过代理选择其所有子节点。

话虽如此，您可以通过确切地检查导致事件处理程序运行的元素，然后执行所需的逻辑来实现您的需求。试试这个：

$('table').on('click', 'tr td', function(e) {
  if (!$(e.target).is('td'))
    return false;

  console.log('clicked');
})

table {
  width: 100%;
  border-collapse: collapse;
}

td {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 10px;
  min-height: 200px;
}

td div {
  padding: 10px;
  border: 1px solid red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>Tes</td>
    <td>
      <div>this is inside a <a href="foo.html">div</a></div>
      Not inside div
    </td>
    <td></td>
    <td></td>
  </tr>
</table>

从此示例中可以看出，console.log()仅在div内的td元素未触发点击事件时才会被调用。

Answer 2

单击div return false

时尝试执行此操作

// Step 1 (Send data to edit.class)
Intent i = new Intent(this, Edit.class);
startActivityForResult(i, 1);

// Step 3 (Receive new data)
public void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);
    if (requestCode == 1) {
        if(resultCode == RESULT_OK) {
            String strEditText = data.getStringExtra("key");

           // update your listview in here with new data
        }     
    }
}

没有子节点的Jquery选择器父级

2 个答案: