2008年6月13日 星期五

Checkbox 全部勾選的方法

這個 DHTML 技巧常常見於 WEB-MAIL 網頁中, 譬如 YAHOO MAIL, 想要勾選全部信件移動或刪除時, 不需傻傻地一個一個勾選, 只要勾選最上面的那個, 就會一次全部選起來. 這是如何做到的?

現在來看看無名的網誌分類管理的作法 :

Javascript :

-----------------------------------------------------------------------------------------------------------

<SCRIPT>

function selectAll(check_component_name, is_checked) {

  var selectors = document.getElementsByName(check_component_name);

  for (i = 0; i < selectors.length; i++) {

    selectors[i].checked = is_checked;

  }

}

</SCRIPT>

-----------------------------------------------------------------------------------------------------------

元件 : (checkbox)

<INPUT onclick="selectAll('delete_c[]',this.checked);" type=checkbox  name=del_all>刪除


<INPUT type=checkbox value=4104619 name=delete_c[]> 讀書劄記

<INPUT type=checkbox value=4104620 name=delete_c[]> 小狐狸生態

<INPUT type=checkbox value=4104622 name=delete_c[]> 新軟體

.........

原來是用 this.checked (true/false) 當值, 傳進 selectAll, 再用迴圈來設定圈選狀態.

嗯, 聰明. STK 系統的轉檔運作正好用得上.

沒有留言 :