チェックボックスtableの行の複数選択

質問

jqueryをやっています。
始めて数週間です。

tableは一番左列がチェックボックスで、一番左列のヘッダ行がチェックボックスです。

やりたいことは、一番左の列にチェックボックスがあるtableをjqueryで操作して、
1.チェックボックス列以外の列をクリックしたときチェックボックスをONにする
2.チェックがついた行は背景色を変える
3.マウスオーバー中に1行ハイライト表示する
4.一番左のヘッダのチェックボックスONで全行の背景色を変える。

参考にしたサイトは以下のサイトです。
http://kachibito.net/snippets/table-tr-check

ここはバグがあって一番左のチェックボックスはクリックしてもONになりません。

いろいろ調べて左列のチェックボックスONのとき、行クリックのイベントに行っているみたいです。
チェックONの行の背景色をつけたりもしたいのですが、よくわかりませんでした。

ヒントだけでも教えてもらえないでしょうか。

よろしくお願いします。

回答No.2

int3 · ベストアンサー

>教えていただいたjsにヘッダのチェックボックスクリック時に全チェックボックスをONにしたくて以下のコードを追加しました。

http://jsfiddle.net/17z691sh/5/
こういうことですかね？

お礼

ありがとうございます。
思い通りのことができました。
ありがとうございます。

回答No.1

int3

>ここはバグがあって一番左のチェックボックスはクリックしてもONになりません。
>チェックONの行の背景色をつけたりもしたいのですが、よくわかりませんでした。

http://jsfiddle.net/17z691sh/1/
例えば、こんなかんじでしょうか？

お礼

ありがとうございます。
教えていただいたjsにヘッダのチェックボックスクリック時に全チェックボックスをONにしたくて以下のコードを追加しました。

$('table th :checkbox').click(function(){
if($(this).is(':checked')){
$('td:first-child input').prop('checked',true);
}else{
$('td:first-child input').prop('checked',false);
};
})

けど思うように行かず。。。
今一度ヒントだけでもお願いできますでしょうか。
よろしくお願いします。