2017-05-22 61 views
0

我有一個表與電視節目,如下圖所示: enter image description here防止表列可以點擊

當我點擊「顯示名稱」,「集」或「播放日期」一欄一個模式彈出以便我可以編輯節目的細節。最後一列中的每一個圖標都有一個目的,所以如果我點擊其中一個圖標,那麼它仍然會按照列的順序對其進行分類,因此會突出顯示我不想要的整行。

這是我的jQuery突出顯示該行:

$('tbody').on("click","tr",function(e) { 
    $('tbody tr').not(this).removeClass('selected_click_cell'); 
    $(this).toggleClass('selected_click_cell'); 
}); 

有沒有辦法仍然突出整行包括即使點擊了最後一欄的圖標的最後一列?或者,點擊時只能突出顯示前3列?

+0

你的問題是點擊冒泡的DOM我相信如果我沒有記錯的話,將這些圖標的z索引更改爲列上方將修復它或另一個路徑是爲了防止默認值。 – Darkrum

+0

@Darkrum嗨,我該如何去做'z-index'?我試着用'1'的'z-index'設置'​​'。我也嘗試用'z-index'創建另一個CSS屬性,但它仍然不起作用。它仍然突出了整個行。 –

+0

你可以請張貼你的HTML嗎? –

回答

0

以下評論:

  • $('tbody tr')是不必要通用的選擇也很慢。將最後選定的行緩存在某處,以便您可以取消選擇該行。
  • addClass而不是toggleClass
  • 不一致的引號字符。
  • 事件冒起來。從圖標點擊事件處理程序返回false。該圖標當然已經比表格行有更高的z順序。
  • 你會發現這種應用程序在Vue JS中比在jQuery變得複雜後更容易開發。