DOM操作checkbox(全选/反选/全不选)
来源:互联网 发布:深圳ps培训 知乎 编辑:程序博客网 时间:2024/06/05 04:07
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>check.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
您的爱好很广泛!!!
<br>
<input type="checkbox" name="checkItems" id="checkItems" value="全选/全不选"/>全选/全不选
<br>
<input type="checkbox" name="items" value="保龄球" />保龄球
<input type="checkbox" name="items" value="篮球"/>篮球
<input type="checkbox" name="items" value="跑步"/>跑步
<input type="checkbox" name="items" value="唱歌"/>唱歌
<br>
<input type="button" name="checkall" id="checkall" value="全选" />
<input type="button" name="checkall" id="checkallNo" value="全不选" />
<input type="button" name="checkall" id="check_revsern" value="反选" />
</body>
<script language="JavaScript">
window.onload=function(){
//<input type="button" name="checkall" id="checkall" value="全选" />
document.getElementById("checkall").onclick=function(){
var itemElements=document.getElementsByName("items");
for(var i=0;i<itemElements.length;i++){
//方法一: <input type="checkbox" name="items" value="足球" />足球
//itemElements[i].setAttribute("checked","checked");
//方法二
itemElements[i].checked="checked";
}
}
//<input type="button" name="checkall" id="checkallNo" value="全不选" />
document.getElementById("checkallNo").onclick=function(){
var itemElements=document.getElementsByName("items");
for (var i = 0; i < itemElements.length; i++) {
var itemElement=itemElements[i];
//方法一,IE行,其他的不行
//itemElement.setAttribute("checked",null);
//方法二: 都行
itemElement.checked=null;
}
}
//<input type="button" name="checkall" id="check_revsern" value="反选" />
document.getElementById("check_revsern").onclick=function(){
var itemElements=document.getElementsByName("items");
for (var i = 0; i < itemElements.length; i++) {
var itemElement = itemElements[i];
//itemElement.checked:如果选中为true,否则false
if(itemElement.checked){
itemElement.checked=null;
}else{
itemElement.checked="checked";
}
}
}
//<input type="checkbox" name="checkItems" id="checkItems" value="全选/全不选"/>全选/全不选
document.getElementById("checkItems").onclick=function(){
//alert(this.checked);
var itemElements=document.getElementsByName("items");
for (var i = 0; i < itemElements.length; i++) {
var itemElement = itemElements[i];
if(this.checked){
itemElement.checked="checked";
}else{
itemElement.checked=null;
}
}
}
}
</script>
</html>
- DOM操作checkbox(全选/反选/全不选)
- DOM全选、全不选、反选的操作
- 09-Dom操作复选框(全选、全不选、反选)
- checkbox全选、全不选、反选
- checkBox全选、反选、全不选
- checkbox全选,全不选,反选
- jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次
- jquery 对 checkbox 的 全选、反选、全不选等操作
- jquery 对 checkbox 的 全选、反选、全不选等操作
- Dom 全选 全不选 反选
- 全选/全不选/反选【DOM】
- jquery 操作 checkbox 全选、反选、清除
- checkbox全选反选
- checkbox 全选 反选
- checkbox全选反选
- checkbox,全选,反选
- checkbox全选反选
- checkbox选择 全选 反选 全不选(简单)
- Eclipse Code Recommenders
- 每个程序员都应该知道的论文和文章
- 一行sql返回mysql中各数据库占用空间大小
- 浅谈ANR及如何分析解决ANR
- 又一款不错的HTML5翻页效果类库介绍
- DOM操作checkbox(全选/反选/全不选)
- Animation-list帧动画使用【微信语音播放动画】
- android中判断网络是否连接
- spring中filter介绍 .
- 电商巨头博弈渐入深水区 供应商争夺战拉开大幕
- 一个简单的跟踪用户访问路径的方法
- struts2注解笔记1
- (转)使用pt-stalk诊断MySQL问题
- 介绍几个PHP的开源不错的图片类库