管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

JQuery对表格进行操作的常用技巧总结

　　1、表格奇数行和偶数行分别添加样式

　　

复制代码 代码如下:

　　$(function(){

　　$('tr:odd').addClass("odd");

　　$('tr:even').addClass("even");

　　});

　　不算表的头部

　　

复制代码 代码如下:

　　$(function(){

　　$('tbody>tr:odd').addClass("odd");

　　$('tbody>tr:even').addClass("even");

　　});

　　2、单选框控制行的高亮显示

　　

复制代码 代码如下:

　　$('tobdy>tr').click(function(){

　　$(this).addClass('selected')

　　.siblings().removeClass('selected')

　　.end() // 重新返回该对象

　　.find(':radio').attr('checked',true);

　　});

　　3、复选框控制行的高亮显示

　　

复制代码 代码如下:

　　$('tobdy>tr').click(function(){

　　if( $(this).hasClass('selected') ){ // 判断是否有selected高亮样式

　　$(this).removeClass('selected')

　　.find(':checkbox').attr('checked',false);

　　}else{

　　$(this).addClass('selected')

　　.find(':checkbox').attr('checked',true);

　　}

　　});

　　4、表格内容筛选

　　

复制代码 代码如下:

　　$(function(){

　　$('table tbody tr').hide()

　　.filter(":contains(李)").show();

　　});

教程首页 更多教程