Question

我有以下情况：我有一些和。我需要检测哪个被点击（最终获得Id）。我已经构建了以下JS Fiddle作为参考。

jQuery(document).ready(function() { 
    $(".table").find("tr").click( function(){
        alert("<tr> clicked");
        var td2 = $(this).find(".td2:first").text();
        alert(td2);
    });
});

我有一个.click（）事件，我点击时会执行一些操作，但我需要检测是否单击了特定的<td>以排除该TD。基本上，当点击任何一个时，应该执行一些操作（除非点击特定的<td>，在这种情况下不应该做任何事情）

您怎么看？

Answer 1

如果要排除td2中的点击次数，那么在点击处理程序中，您可以使用event.target来获取点击的实际元素。

jQuery(document).ready(function() {
  $(".table tr").click(function(e) {
    if ($(e.target).closest('td').is(':nth-child(2)')) {
      snippet.log('td2 clicked');
      return;
    }
    snippet.log("<tr> clicked");
    var td2 = $(this).find("td:nth-child(2)").text();
    snippet.log('td2: ' + td2)
  });
});

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="table">
  <tr>
    <td class="td1"></td>
    <td class="td2">A</td>
    <td class="td3">B</td>
    <td class="td4">C</td>
    <td class="td5">D</td>
  </tr>
  <tr>
    <td>1</td>
    <td>A1</td>
    <td>B1</td>
    <td>C1</td>
    <td>D1</td>
  </tr>
  <tr>
    <td>2</td>
    <td>A2</td>
    <td>B2</td>
    <td>C2</td>
    <td>D2</td>
  </tr>
  <tr>
    <td>3</td>
    <td>A3</td>
    <td>B3</td>
    <td>C3</td>
    <td>D3</td>
  </tr>
</table>

Answer 2

如果您尝试将特定操作应用于td代码，除非它们包含特定类，您可以使用:not排除该类。您也可以将点击事件直接应用于td：JS Fiddle

$('td:not(.td2)').click(function () {
    var clickedCell = $(this).text();
    alert(clickedCell);
});

如何检测单击的内容

2 个答案: