當前位置：軟件學堂 > 資訊首頁 > 網絡編程 > 編程其他 > JS代碼實現復選框全選(2)

JS代碼實現復選框全選(2)

2012/11/1 20:08:30作者：佚名來源：網絡

移動端

【實例名稱】

JS代碼實現復選框全選(2)

【實例描述】

復選框的全選功能通過服務器端開發語言可以很方便地實現，但有時為了提高頁面的訪問速度，需要使用JavaScript完成。本例學習實現全選的JavaScript方法。

【實例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標題頁-學無憂（www.yzddtk.cn）</title>
<SCRIPT LANGUAGE="JavaScript">
function checkAll(str)
{
  var a = document.getElementsByName(str);       
//獲取所有復選框
  var n = a.length;                              
//獲取復選框的個數
  for (var i=0; i<n; i++)
  a[i].checked = window.event.srcElement.checked;
//通過單擊的按鈕判斷是選中還是未選
}
</script>
</head>
<body>
<input type=checkbox name=All onclick="checkAll('ck')">全選<br/>
<input type=checkbox name=ck  >體育<br/>
<input type=checkbox name=ck  >旅游<br/>
<input type=checkbox name=ck  >飲食<br/>
<input type=checkbox name=ck  >影視<br/>
<input type=checkbox name=ck  >音樂<br/><br/></body>
</html>

【運行效果】

復選框全選運行效果

【難點剖析】

本例的重點是如何獲取頁面中所有的復選框控件。使用“document．getElementsByName”可以獲取頁面中所有的復選框控件，然后使用“window．event．srcElement．checked”判斷是選中還是未選。

【源碼下載】

如果你不愿復制代碼及提高代碼準確性，你可以點擊：復選框全選（2）進行本實例源碼下載

標簽：復選框

上一篇：JS代碼實現復選框全選(1)
下一篇：通過JS代碼如何獲取復選框的選擇項

相關文章

熱門軟件/ 推薦游戲/ 手機軟件

資訊分類

Dreamweaver Flash DIV+CSS 編程其他

推薦教程

精品軟件推薦

360安全衛士

訊飛輸入法

欧美一级一极性活片免费观看,欧美一级艳片欧美精品,欧美一级性爱大片,欧美一级囗交视频视频,欧美一级特黄录像视频