Question

我正在使用这些来制作可点击的链接行，但我不想包含该复选框，因为我使用复选框来过滤其他操作。

是否可以除了行上的复选框？

如何防止特定目标的点击处理程序

jQuery(document).ready(function($) {
  $(".clickable-row").click(function() {
    window.document.location = $(this).data("href");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped table-bordered table-hover table_adj table-checkable txt-col mar_bot_10">
  <thead>
    <tr>
      <th>
        <label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
          <input class="mail-group-checkbox" type="checkbox" value="movetofilter"> <span></span>
        </label>
      </th>
      <th>a</th>
      <th><span data-placement="bottom" data-toggle="tooltip" title="Added Reference">b</span>
      </th>
      <th>c</th>
      <th>d</th>
      <th><span data-placement="bottom" data-toggle="tooltip" title="Received Message">e</span>
      </th>
      <th><span data-placement="bottom" data-toggle="tooltip" title="Received Date">f</span>
      </th>
      <th>g</th>
      <th>h</th>
      <th class="text-right">i</th>
    </tr>
  </thead>
  <tbody>
    <tr class='clickable-row' data-href='http://stackoverflow.com'>
      <td>
        <label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
          <input class="mail-group-checkbox" type="checkbox" value="movetofilter"> <span></span>
        </label>
      </td>
      <td>1
      </td>
      <td class="text70px">1</td>
      <td class="text170px">1</td>
      <td>212</td>
      <td class="text40px">23</td>
      <td class="text70px">2</td>
      <td class="text40px">4</td>
      <td class="text70px">5</td>
      <td class="text70px text-right">6</td>
    </tr>

Answer 1

您可以使用event.target验证点击的元素。

$(".clickable-row").click(function(event) {
    // Check if target is NOT inside '.mt-checkbox'
    if(!$(event.target).closest('.mt-checkbox').length){
        window.document.location = $(this).data("href");
    }
});

如何防止特定目标的单击处理程序

1 个答案: