當一個單元格進入編輯模式時，除一個單元格（在選定的行中）外，禁用其他任何位置

Question

如何禁用除連續一個單元格外的所有網格單元格的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;
});

但這沒有任何效果，因為第一個代碼段禁用了點擊。 實現此目的的正確方法是什么？

Answer 1

您可以在此處使用: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排除在所選行td[aria-describedby="QCStatus_ActionIcons"] ？

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

Answer 2

將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> 

在這里擺弄

Answer 3

在您要禁用點擊的按鈕上添加“禁用”屬性。

對於div禁用的屬性不起作用。

在這種情況下，請使用“ pointer-events：none;”。 在您的特定div的CSS中。