突出顯示一個動態創建的行

我有一張表格，每次按下「添加」按鈕時都會添加一行。我有一個「編輯」按鈕，放置在新創建的行的第一個單元格中。突出顯示一個動態創建的行

我想突出顯示正在編輯的行。我知道我可以得到當前<tr>元素像

var par = $(this).parent().parent();

但是當我使用，

par.css('border-color', 'red');

它不會改變顏色。我犯了什麼錯誤，應該如何突出顯示特定行？

來源

2013-07-17 Prasanna

什麼是'這個'這裏 –

你可以發表小提琴嗎？ – mohkhan

嘗試'var par = $（this）.closest（'tr'）' –

這確實是對<tr>的造型使用.closest()。 CSS不喜歡風格<tr>的因爲他們真的只存在語義。爲了添加一個邊框，你需要使它成爲display: block;。

這是一個jsFiddle和示例代碼。

HTML

<table> 
    <tbody> 
     <tr><td>Some Content</td></tr> 
     <tr><td>Some Content</td></tr> 
     <tr> 
      <td> 
       <a href="#" class="edit">Edit</a> 
      </td> 
     </tr> 
     <tr><td>Some Content</td></tr> 
     <tr><td>Some Content</td></tr> 
    </tbody> 
</table>

的Javascript

$(".edit").click(function(e) { 
    $(this).closest('tr').toggleClass('editting'); 
    e.preventDefault(); 
});

CSS

table tr { 
    display: block; 
    border: 1px solid rgba(0, 0, 0, 0); 
} 

.editting { 
    background: #FAA; 
    border: 1px solid red; 
}

請注意我是如何使用的rgba顏色使邊框不透明。還有其他的方法可以做到這一點，但是如果您關閉邊框，會導致表格「抖動」。

來源

2013-07-17 12:35:06 screenmutt

假設this指tr中的元素，那麼這將是更好地在這裏

var par = $(this).closest('tr')

來源

2013-07-17 11:51:16

突出顯示一個動態創建的行

回答

相關問題