选中单选按钮时更改表格单元格的颜色

我希望我的单选按钮单元格旁边的单元格在选中单选按钮时突出显示为绿色，并在移动到未选中时变回灰色。 换句话说，包含获胜团队价值的单选按钮应该将包含该团队名称的单元格变为绿色。

$('input:radio').checked(function() { $(this).closest('td').addClass('highlight'); }); 

 .highlight { background: green; } 

   Fiesta Bowl    Arizona    Boise State January 1  

Answer 1

绑定处理程序的函数是.checked ，而不是.checked 。 然后，您需要更新包含所有复选框的TD的类。

 $('input:radio').click(function() { $("input:radio").each(function() { $(this).closest("td").toggleClass("highlight", $(this).is(":checked")); }); }); 

 .highlight { background: green; } 

  
 
 
Fiesta Bowl
 
  
 
Arizona
 
  
 
Boise State
 
January 1
 
  

Answer 2

 $('input:radio').change(function() { var $td = $(this).parent(); $td.siblings().removeClass('highlight'); $td.next().addClass('highlight'); }); 

这是一个小提琴

Answer 3

 $('input:radio').change(function( event ) { $( "td" ).each(function() { $( this ).removeClass( "highlight" ); }); $( event.target ).closest( "td" ).next("td").addClass("highlight"); }); 

这是工作示例
http://jsfiddle.net/6bc07guq/