javascript 全選與全取消功能的實現(xiàn)代碼
更新時間：2012年12月23日 16:20:49 作者：
全選與全取消在工作過程中經(jīng)常會使用到，是因為它很方便，同時可以提高用戶體驗值，本文介紹如何使用javascript實現(xiàn)全選與全取消功能,需要了解的朋友可以參考下
復(fù)制代碼 代碼如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<script type="text/javascript" language="javascript">
function selectAll()
{
var allCheckBoxs = document.getElementsByName("coffee");
var desc = document.getElementById("like");
if(desc.value == "都喜歡")
{
desc.value = "都不喜歡";
for(var i = 0; i < allCheckBoxs.length; i ++ )
{
allCheckBoxs[i].checked = true;
}
}
else
{
desc.value = "都喜歡";
for(var i = 0; i < allCheckBoxs.length; i ++ )
{
allCheckBoxs[i].checked = false;
}
}
}
</script>
</head>
<body>
<p>你喜歡那種類型咖啡</p>
<form>
<input type="checkbox" name="coffee" value="cream">藍山咖啡<br>
<input type="checkbox" name="coffee" value="sugar" >摩卡<br>
<input type="checkbox" name="coffee" value="sugar">拿鐵<br>
<input type="checkbox" name="coffee" value="sugar">卡布奇諾<br>
<input type="checkbox" name="coffee" value="sugar">愛爾蘭咖啡<br>
<input type="button" id="like" value="都喜歡" onClick="selectAll()">
</form>
</body>
</html>
您可能感興趣的文章:
- 比較全的JS checkbox全選、取消全選、刪除功能代碼
- Javascript實現(xiàn)CheckBox的全選與取消全選的代碼
- js multiple全選與取消全選實現(xiàn)代碼
- js實現(xiàn)復(fù)選框的全選和取消全選效果
- javascript 全選/反選,取消選擇效果
- 基于JavaScript實現(xiàn)復(fù)選框的全選和取消全選
- CheckBox為CheckBoxList實現(xiàn)全選或全取消選擇(js代碼實現(xiàn))
- JS小功能(checkbox實現(xiàn)全選和全取消)實例代碼
- JS控件ASP.NET的treeview控件全選或者取消(示例代碼)
- JS實現(xiàn)表單全選以及取消全選實例
相關(guān)文章
javascript編程起步（第五課）...2007-02-02
JavaScript初級教程(第五課續(xù))...2007-04-04
JS 模態(tài)對話框和非模態(tài)對話框操作技巧匯總
模態(tài)窗口javascript 技巧包括傳值、打開、刷新以及相關(guān)實例學(xué)習(xí)，感興趣的朋友可以參考下哈2013-04-04
JavaScript的注釋使用方法
2008-12-12 
javascript開發(fā)技術(shù)大全 第2章 開始JAVAScript之旅
1st JavaScript Editor ,除了有著色處，還有html標簽、屬性、javascript事件、函數(shù)，另外還可調(diào)用外部編輯來編輯網(wǎng)頁，也可將常用瀏覽器內(nèi)置在窗口中。
2011-07-07 
這篇文章主要介紹了詳解JavaScript中的forEach()方法的使用,是JS入門學(xué)習(xí)中的基礎(chǔ)知識,需要的朋友可以參考下
2015-06-06 
javascript中的對象和數(shù)組的應(yīng)用技巧
javascript中的對象和數(shù)組的應(yīng)用技巧...
2007-01-01 
使用Java實現(xiàn)簡單的server/client回顯功能的方法介紹
本篇文章介紹了，使用Java實現(xiàn)簡單的server/client回顯功能的方法。需要的朋友參考下
2013-05-05 
這篇文章主要介紹了DOM基礎(chǔ)教程之使用DOM控制表單的相關(guān)資料,需要的朋友可以參考下
2015-01-01