当前位置：首页 > 资讯 > 技术文档

JavaScript第一篇之实现按钮全选、功能

时间：2022-07-26 19:54 编辑：来源：阅读：
扫一扫，手机访问

摘要：JavaScript第一篇之实现按钮全选、功能

1、新建一个文档（用NotePad软件，为了使得在浏览器中打开不是乱码，在软件的文件出找到编码，将其修改为UTF-8编码。或者点击谷歌浏览器中的右上角的三条杠，选择更多工具->编码->UTF-8），将其重命名（例：第一个java script.html 注：一定要把扩展名改为.html）。 2、将其用记事本的格式打开，进行编写。 3、以下是编写的“按钮全选的实现”的相关代码：

<html>
<head>
<title> 全选按钮的实现 </title>
</head>
<body>
<div>
<input type="checkbox" id="chkAll" onclick="checkAll(this)" />全选
</div>
<div>
<input type="checkbox" name="chk"/>选项1
</div>
<div>
<input type="checkbox" name="chk"/>选项2
</div>
<div>
<input type="checkbox" name="chk"/>选项3
</div>
<div>
<input type="checkbox" name="chk"/>选项4
</div>
<input type="checkbox" name="chk"/>选项5
</div>
</body>
<script>
//全选
function checkAll(e)
{
var t=document.getElementsByName("chk");
alert(t.length);
for(var i=0;i<t.length;i++)
{
t[i].checked=document.getElementById("chkAll").checked;
}
}
</script>
</html>

4、截图为： [img]http://files.jb51.net/file_images/article/201608/201608211440072.png?2016721144127[/img]

全部评论(0)

上一篇：深入理解Javascript中的观察者模式
下一篇：Javascript中的函数声明与函数表达式(奇技淫巧)

资讯排行榜
更多>>