javascript 全选与全取消功能的实现代码
更新时间：2012年12月23日 16:20:49 作者：
全选与全取消在工作过程中经常会使用到，是因为它很方便，同时可以提高用户体验值，本文介绍如何使用javascript实现全选与全取消功能,需要了解的朋友可以参考下
复制代码 代码如下:
<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>
相关文章
javascript编程起步（第五课）...2007-02-02
JavaScript初级教程(第五课续)...2007-04-04
模态窗口javascript 技巧包括传值、打开、刷新以及相关实例学习，感兴趣的朋友可以参考下哈2013-04-04
javascript object oriented 面向对象编程初步
javascript object oriented 面向对象编程初步...2007-01-01
JavaScript的注释使用方法2008-12-12
javascript开发技术大全 第2章 开始JAVAScript之旅
1st JavaScript Editor ,除了有着色处，还有html标签、属性、javascript事件、函数，另外还可调用外部编辑来编辑网页，也可将常用浏览器内置在窗口中。2011-07-07
这篇文章主要介绍了详解JavaScript中的forEach()方法的使用,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06
javascript中的对象和数组的应用技巧...2007-01-01
使用Java实现简单的server/client回显功能的方法介绍
本篇文章介绍了，使用Java实现简单的server/client回显功能的方法。需要的朋友参考下2013-05-05
这篇文章主要介绍了DOM基础教程之使用DOM控制表单的相关资料,需要的朋友可以参考下2015-01-01
最新评论