控制表单
1、初始化
$(function(){ $("tbody>tr:odd").addClass("odd"); //先排除第一行,然后给奇数行添加样式 $("tbody>tr:even").addClass("even"); //先排除第一行,然后给偶数行添加样式 2.1. $("tr:contains ('王五')").addClass ("selected");//选中内容为'王五'的 2.2. $('tbody>tr').click(function() {//点击哪个td的单选按钮就高亮显示 $(this) .addClass('selected') .siblings().removeClass('selected') .end() .find(':radio').attr('checked',true); }); // 如果单选框默认情况下是选择的，则高色. // $('table :radio:checked').parent().parent().addClass('selected'); //简化: $('table :radio:checked').parents("tr").addClass('selected'); //再简化: //$('tbody>tr:has(:checked)').addClass('selected'); 2.3.1. $('tbody>tr').click(function() {//点击哪个td的复选按钮就高亮显示 if ($(this).hasClass('selected')) { $(this) .removeClass('selected') .find(':checkbox').attr('checked',false); }else{ $(this) .addClass('selected') .find(':checkbox').attr('checked',true); } }); // 如果复选框默认情况下是选择的，则高色. // $('table :checkbox:checked').parent().parent().addClass('selected'); //简化: $('table :checkbox:checked').parents("tr").addClass('selected'); //$('tbody>tr:has(:checked)').addClass('selected'); 2.3.2. $('tbody>tr').click(function() { //判断当前是否选中 var hasSelected=$(this).hasClass('selected'); //如果选中，则移出selected类，否则就加上selected类 $(this)[hasSelected?"removeClass":"addClass"]('selected') //查找内部的checkbox,设置对应的属性。 .find(':checkbox').attr('checked',!hasSelected); }); // 如果复选框默认情况下是选择的，则高色. $('tbody>tr:has(:checked)').addClass('selected'); })