javascript 全選與全取消功能的實(shí)現(xiàn)代碼
更新時(shí)間:2012年12月23日 16:20:49 作者:
全選與全取消在工作過程中經(jīng)常會(huì)使用到,是因?yàn)樗芊奖?,同時(shí)可以提高用戶體驗(yàn)值,本文介紹如何使用javascript實(shí)現(xiàn)全選與全取消功能,需要了解的朋友可以參考下
復(fù)制代碼 代碼如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標(biāo)題文檔</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">藍(lán)山咖啡<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實(shí)現(xiàn)CheckBox的全選與取消全選的代碼
- js multiple全選與取消全選實(shí)現(xiàn)代碼
- js實(shí)現(xiàn)復(fù)選框的全選和取消全選效果
- javascript 全選/反選,取消選擇效果
- 基于JavaScript實(shí)現(xiàn)復(fù)選框的全選和取消全選
- CheckBox為CheckBoxList實(shí)現(xiàn)全選或全取消選擇(js代碼實(shí)現(xiàn))
- JS小功能(checkbox實(shí)現(xiàn)全選和全取消)實(shí)例代碼
- JS控件ASP.NET的treeview控件全選或者取消(示例代碼)
- JS實(shí)現(xiàn)表單全選以及取消全選實(shí)例
相關(guān)文章
javascript typeof id===''string''?document.getElementById(id
剛開始學(xué)習(xí)js的朋友可能會(huì)有些疑問,其實(shí)這段代碼使用js的三元運(yùn)算符,這樣代碼看起來高大上,最主要是代碼段少2016-11-11js中g(shù)etBoundingClientRect( )方法案例詳解
這篇文章主要介紹了js中g(shù)etBoundingClientRect( )方法案例詳解,本篇文章通過簡要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-07-07javascript中call,apply,bind的用法對(duì)比分析
這篇文章主要給大家對(duì)比分析了javascript中call,apply,bind三個(gè)函數(shù)的用法,非常的詳細(xì),這里推薦給小伙伴們。2015-02-02