jQuery 全選 反選 單擊行改變背景色

我先把css樣式放出來，其實這個可以直接忽略

body.datagrid.datagird tr th.datagrid tr th, .datagrid tr td

/*選中行樣式 
*/.table-row-selected

我們再來看頁面html結構

<

div 
id="page"
>
<
table 
class
="datagrid"
cellpadding
="0"
cellspacing
="0"
>
<
thead
>
<
tr>
<
th><
input 
id="checkall"
name
="checkall"
type
="checkbox"
/>
th>
<
th>id
th>
<
th>標題
th>
<
th>發布人
th>
<
th>發布時間
th>
tr>
thead
>
<
tbody
>
<
tr>
<
td align
="center"
><
input 
type
="checkbox"
name
="check"
/>
td>
<
td align
="center"
width
="5%"
>1
td>
<
td>阿里做對了哪三件事？
td>
<
td align
="center"
width
="10%"
>internet
td>
<
td align
="center"
width
="15%"
>2013-07-01
td>
tr>
<
tr>
<
td align
="center"
><
input 
type
="checkbox"
name
="check"
/>
td>
<
td align
="center"
width
="5%"
>2
td>
<
td>**點：被網際網路改寫的16個傳統行業
td>
<
td align
="center"
width
="10%"
>internet
td>
<
td align
="center"
width
="15%"
>2013-07-01
td>
tr>
<
tr>
<
td align
="center"
><
input 
type
="checkbox"
name
="check"
/>
td>
<
td align
="center"
width
="5%"
>3
td>
<
td>如果智慧型手機市場有變，酷派們怎麼辦？
td>
<
td align
="center"
width
="10%"
>internet
td>
<
td align
="center"
width
="15%"
>2013-07-01
td>
tr>
<
tr>
<
td align
="center"
><
input 
type
="checkbox"
name
="check"
/>
td>
<
td align
="center"
width
="5%"
>4
td>
<
td>看看福特們是如何抵禦谷歌蘋果的？
td>
<
td align
="center"
width
="10%"
>internet
td>
<
td align
="center"
width
="15%"
>2013-07-01
td>
tr>
tbody
>
table
>
div>

實現功能

1）單擊行改變背景色

2）全選/反全選功能

//

單擊行改變背景色 選中行
$(".datagrid tbody tr
").bind("
click
", function () 
else
var len = $("
table.datagrid tbody
").find("
input[name='check']
").length;
var count = 0
; $(
"table.datagrid
").find("
input[name='check']
").each(function (i) 
});if (len ==count) 
else
});//
全選$("
#checkall
").bind("
click
", function () 
else
});

ps：功能都太簡單了，我都不好意思發出來。但工作中又經常會寫一些重複性程式碼，想想還是貼出來

順便也可以提高自己的一點點積極性。thx，that's all

jquery全選 反選

function a flag 改變select的text ddlyeargroup 0 options 0 text all 其他參考 ddlstep empty 清空 ddlstep attr value 9 根據value選擇 ddlstep 0 selectedindex 1 select下...

select 全選和反選 jquery

checkbox id in shareuser 10 name shareuser value 10 10 checkbox id in shareuser 11 name shareuser value 11 11 checkbox id in shareuser 12 name shareus...

jquery實現checkbox全選反選

對於jquery 1.6 的版本而言，用attr 去設定checkbox的checked屬性是不正確的。應該用prop 方法 input name checkbox name prop checked this prop checked 以下內容作廢 2014 09 11 jquery版本 1.4....