如何选择不包括某些按钮或类的 id？答案

【问题标题】：how to select id excluding certain button or class?如何选择不包括某些按钮或类的 id？
【发布时间】：2021-04-18 02:52:30
【问题描述】：

我有一张这样的桌子：

第一行是thead，第二行是id="chosen"的tbody。

我创建了一个函数，用于在单击 X 按钮时删除最近的 tr。然后，当我单击除按钮之外的整行时，我正在做其他事情。（现在，检查的功能警报消息）

但问题是，如果我单击 X 按钮，则会出现一条警告消息。所以，我想在调用第二个函数时排除 X 按钮区域。

我试过 .not() 但它没有用。 :(

该表的 HTML 代码：

                <table class="table table-bordered table-sm table-hover">
                    <thead>
                        <tr class="thead-light border">
                            <th>퀘스트 이름</th>
                            <th>난이도</th>
                            <th>목표</th>
                            <th>추천맵</th>
                            <th>반납</th>
                            <th width="50px">삭제</th>
                        </tr>
                    </thead>
                    <tbody id="chosen">

                    </tbody>
                </table>

我的脚本在这里：

<script>
$(document).ready(function($) {
    $(".clickable-row").click(function() {
        var cloned = $(this).clone();
        cloned.append('<td align="center";><button type="button" class="delete">X</button></td>');
        $(cloned).appendTo($("#chosen"));
    });

     $("#reset").on("click", function() {
        $("#chosen").empty();
    });-

     $("#chosen").on("click", ".delete", function() {
        $(this).closest("tr").remove();
    });

    $("#chosen").not(".delete").on("click", function() {
        alert("Just for check")
    });

});
</script>

第一个函数创建一个包含删除按钮的行，然后附加到“选择”tbody。

【问题讨论】：

你好。 html 中的.clickable-row 在哪里？

标签： javascript html jquery

【解决方案1】：

您可以使用td:not(:last-child) 从删除按钮所在的tr 中排除最后一个 td。

演示代码：

//not last td 
$("#chosen").on("click", "tr td:not(:last-child)", function() {
  alert("Just for check")
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<table class="table table-bordered table-sm table-hover">
  <thead>
    <tr class="thead-light border">
      <th>퀘스트 이름</th>
      <th>난이도</th>
      <th>목표</th>
      <th>추천맵</th>
      <th>반납</th>
      <th width="50px">삭제</th>
    </tr>
  </thead>
  <tbody id="chosen">
    <tr>
      <td>name2</td>
      <td>difficulty2</td>
      <td>goal2</td>
      <td>recommended2</td>
      <td>return2</td>
      <td><button type="button" class="delete">X</button></td>
    </tr>
    <tr>
      <td>nam2</td>
      <td>difficulty2</td>
      <td>goal2</td>
      <td>recommended2</td>
      <td>return2</td>
      <td><button type="button" class="delete">X</button></td>
    </tr>
  </tbody>
</table>

【讨论】：