如何使用複選框使用Javascript更改<tr> bgcolor？

Question

我有這個網站

<table border="1"> 
    <tr> 
     <td> 
      <input type="checkbox"> 
     </td> 
     <td> 
      Hello 
     </td> 
     <td> 
      my friend! 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <input type="checkbox"> 
     </td> 
     <td> 
      ... 
     </td> 
     <td> 
      ... 
     </td> 
    </tr> 
    ... 
</table> 

什麼我需要做的，如果我想在此複選框被激活，以改變我的<tr> BGCOLOR？我想我需要用onclick()來做點什麼。

編輯：我需要的是複選框應該只修改他當前的行。

Answer 1

之一可能的方法：

document.getElementById('table').onclick = function(e) { 
    var e = e || event, 
     el = e.srcElement || e.target; 
    if (el.tagName == 'INPUT') { 
     el.parentNode.parentNode.className = el.checked ? 'active' : ''; 
    } 
}; 

http://jsfiddle.net/TQbpH/2/

在此示例性事件氣泡s到監聽它的父表，然後在需要時調度它。

Answer 2

http://jsfiddle.net/L6xsB/

$(function() { 
    $('tr').on('click', 'input:checkbox', function() { 
     $(this).parents('tr').toggleClass('active'); 
    }); 
}); 

CSS：

tr.active { 
    background-color: #FFC; 
}