快捷導(dǎo)航

JQuery對(duì)表格進(jìn)行操作的常用技巧總結(jié)

更新時(shí)間：2014年04月23日 15:57:04 作者：

這篇文章主要介紹了JQuery對(duì)表格進(jìn)行操作的常用技巧,需要的朋友可以參考下

1、表格奇數(shù)行和偶數(shù)行分別添加樣式

 
$(function(){ 
$('tr:odd').addClass("odd"); 
$('tr:even').addClass("even"); 
}); 

不算表的頭部

復(fù)制代碼代碼如下:

 
$(function(){ 
$('tbody>tr:odd').addClass("odd"); 
$('tbody>tr:even').addClass("even"); 
}); 

2、單選框控制行的高亮顯示

復(fù)制代碼代碼如下:

 
$('tobdy>tr').click(function(){ 
$(this).addClass('selected') 
.siblings().removeClass('selected') 
.end() // 重新返回該對(duì)象 
.find(':radio').attr('checked',true); 
}); 

3、復(fù)選框控制行的高亮顯示

復(fù)制代碼代碼如下:

 
$('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、表格內(nèi)容篩選

復(fù)制代碼代碼如下:

 
$(function(){ 
$('table tbody tr').hide() 
.filter(":contains(李)").show(); 
}); 

您可能感興趣的文章:

相關(guān)文章

jQuery+ajax實(shí)現(xiàn)用戶登錄驗(yàn)證
這篇文章主要為大家詳細(xì)介紹了jQuery+ajax實(shí)現(xiàn)用戶登錄驗(yàn)證，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-09-09
jquery dialog open后,服務(wù)器端控件失效的快速解決方法
本篇文章是對(duì)jquery dialog open后,服務(wù)器端控件失效的快速解決方法。進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2013-12-12
jQuery插件JWPlayer視頻播放器用法實(shí)例分析
這篇文章主要介紹了jQuery插件JWPlayer視頻播放器用法,結(jié)合實(shí)例形式分析了JWPlayer插件播放視頻的相關(guān)操作技巧,需要的朋友可以參考下
2017-01-01
jQuery實(shí)現(xiàn)的購物車物品數(shù)量加減功能代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)的購物車物品數(shù)量加減功能,涉及jQuery針對(duì)鼠標(biāo)事件的響應(yīng)及頁面元素動(dòng)態(tài)操作相關(guān)技巧,需要的朋友可以參考下
2016-11-11
JavaScript/jQuery、HTML、CSS 構(gòu)建 Web IM 遠(yuǎn)程及時(shí)聊天通信程序
這篇文章主要介紹用JavaScript和jQuery、HTML、CSS以及用第三方聊天JavaScript（jsjac）框架構(gòu)建一個(gè)BS Web的聊天應(yīng)用程序。此程序可以和所有連接到Openfire服務(wù)器的應(yīng)用進(jìn)行通信、發(fā)送消息。如果要運(yùn)行本程序還需要一個(gè)聊天服務(wù)器Openfire
2012-08-08
jQuery Ajax中的事件詳細(xì)介紹
這篇文章主要介紹了jQuery Ajax中的事件詳細(xì)介紹,本文詳細(xì)的講解了AJAX的局部事件和全局事件、事件的順序等內(nèi)容,需要的朋友可以參考下
2015-04-04
jQuery實(shí)現(xiàn)圖片漸入漸出切換展示效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)圖片漸入漸出切換展示效果,需要的朋友可以參考下
2015-08-08
jquery插件uploadify實(shí)現(xiàn)帶進(jìn)度條的文件批量上傳
這篇文章主要介紹了jquery插件uploadify實(shí)現(xiàn)帶進(jìn)度條的文件批量上傳，感興趣的小伙伴們可以參考一下
2015-12-12
jQuery實(shí)現(xiàn)異步獲取json數(shù)據(jù)的2種方式
這篇文章主要介紹了jQuery實(shí)現(xiàn)異步獲取json數(shù)據(jù)的2種方式,主要講述了$.getJSON方法與$.ajax方法,非常實(shí)用,需要的朋友可以參考下
2014-08-08
jquery Validation表單驗(yàn)證使用詳解
功能強(qiáng)大的 jquery 表單驗(yàn)證插件，適用于日常的 E-mail、電話號(hào)碼、網(wǎng)址等驗(yàn)證及 Ajax 驗(yàn)證，除自身擁有豐富的驗(yàn)證規(guī)則外，還可以添加自定義的驗(yàn)證規(guī)則。兼容 IE 6+, Chrome, Firefox, Safari, Opera 10+
2015-04-04