当单元格进入编辑模式时，禁止在除一个单元格(选定行中）之外的任何位置单击

Disable click anywhere except one cell (in the selected row) when a cell enters the edit mode

本文关键字：单元格 一个 单击 位置 任何 模式 编辑 禁止      更新时间：2023-09-26

如何在除一行中的一个单元格外的所有网格单元格上禁用click？当一个单元格进入编辑模式时，我试图禁用对网格中任何单元格的单击。所以我尝试了：

$('#QCStatus tr td').bind('click',function() {
        return false;
});
//QCStatus is the id of the grid

为了在正在编辑的同一行中启用点击单元格，我尝试了：

$('#QCStatus tr.selected-row td[aria-describedby="QCStatus_ActionIcons"]').bind('click',function() {
        return true;
});

但这并没有任何效果，因为第一个片段禁用了单击。实现这一目标的正确方法是什么？

您可以在此处用:not()排除所选行：

$('#QCStatus tr:not(.selected) td').on('click', function(e) {
  $('pre').prepend('event :::: '+e.type+''n');
  return false;
});
.selected{background:yellow;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table id='QCStatus'>
  <tr><td>click</td></tr>
  <tr class='selected'><td>click</td></tr>
  <tr><td>click</td></tr>
  <tr><td>click</td></tr>
</table>
<pre></pre>

这将绑定不是tr.selected的子级的所有td上的单击。

根据您的评论，您可以添加更多：

我如何才能排除所选行td[aria-describedby="QCStatus_ActionIcons"]中的td

$('#QCStatus tr:not(.selected) td:not([aria-describedby="QCStatus_ActionIcons"])').on('click', function(e) {
  $('pre').prepend('event :::: '+e.type+''n');
  return false;
});

使用event.stoppropagation()作为click事件中要消除的元素。它可以防止当前事件的进一步传播。

$('tr').on('click', function() {
  console.log('clicked!');
});
$('.disabled').on('click', function(e) {
  e.stopPropagation();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<table border="1">
  <tr>
    <td>Hello</td>
    <td class="disabled">Disabled</td>
  </tr>
  <tr>
    <td>Hello</td>
    <td class="disabled">Disabled</td>
  </tr>
  <tr>
    <td>Hello</td>
    <td class="disabled">Disabled</td>
  </tr>
</table>

Fiddle here

为要禁用单击的按钮添加一个"disabled"属性。

对于div禁用的属性不起作用。

在这些情况下，在特定div的css中使用"pointer-events:none；"。

相关文章：