zer931的部落格

(JavaScript) checkbox全選範例

from http://www.wretch.cc/blog/persongood/14193719

最近實在是太忙了，幾乎每天都八點多才回家，回到家差不多九點了！
回來都是累趴在地上，真是忙忙忙啦，太久沒作筆記了！今天來作個我之前用到的check全選作法

這都在網路上找的，當然是可以使用啦！不過我還要搭配PHP下去使用，才是我要的結果！ 
第一種：勾選checkbox才能全選

＜script language="JavaScript"＞
function CheckAll() ｛ 
var ck = document.form.elements["c1[]"]; 
var ckAll = document.form.allbox; 
if (!ck) ｛ //當沒有checkbox時 
ckAll.checked = false; 
｝ else if (!ck.length) ｛ //當只有一個checkbox時 
ck.checked = ckAll.checked; 
｝ else ｛ //當有兩個以上的checkbox時 
for (var i=0;i＜ck.length;i++) 
ck[i].checked = ckAll.checked; 
｝ 
｝ 
＜/script＞
＜form name="form"＞
＜input type="checkbox" name="allbox" onclick="CheckAll()"＞全選＜br＞ 
＜input type="checkbox" name="c1[]" value="1"＞＜br＞
＜input type="checkbox" name="c1[]" value="2"＞＜br＞ 
＜input type="checkbox" name="c1[]" value="3"＞＜br＞ 
＜input type="checkbox" name="c1[]" value="4"＞＜br＞ 
＜input type="checkbox" name="c1[]" value="5"＞＜br＞ 
＜/form＞


第二種：全選，取消，反向選取都分開按（就跟yahoo的信箱全選是一樣的）

＜script type="text/javascript"＞
＜!--
function selAll()｛
//變數checkItem為checkbox的集合
var checkItem = document.getElementsByName("c1");
for(var i=0;i＜checkItem.length;i++)｛
checkItem[i].checked=true; 
｝
｝
function unselAll()｛
//變數checkItem為checkbox的集合
var checkItem = document.getElementsByName("c1");
for(var i=0;i＜checkItem.length;i++)｛
checkItem[i].checked=false;
｝
｝
function usel()｛
//變數checkItem為checkbox的集合
var checkItem = document.getElementsByName("c1");
for(var i=0;i＜checkItem.length;i++)｛
checkItem[i].checked=!checkItem[i].checked;
｝
｝
//--＞
＜/script＞

＜input TYPE="checkbox" name="c1"＞ 
＜input TYPE="checkbox" name="c1"＞ 
＜input TYPE="checkbox" name="c1"＞ 
＜input TYPE="checkbox" name="c1"＞ 
＜input type="checkbox" name="c1"＞ 
＜input type="checkbox" name="c1"＞ 
＜input type="checkbox" name="c1"＞ 
＜input type="checkbox" name="c1"＞ 
＜br＞ 
＜input type="button" value="全選" onclick="selAll();"＞
＜input type="button" value="全取消" onclick="unselAll();"＞
＜input type="button" value="反向選取" onclick="usel();"＞