JavaScript实现的全选、全不选和反选的代码

最新推荐文章于 2024-07-29 11:53:27 发布

yuhan20081021

最新推荐文章于 2024-07-29 11:53:27 发布

阅读量910

点赞数

分类专栏： javascript 文章标签： javascript 全选全不选反选

javascript 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

//例一

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script>

//例二

/*
<!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>
您的爱好很广泛!!!
<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.οnlοad=function(){
     //全选
  document.getElementById("checkall").οnclick=function(){
   var itemElements=document.getElementsByName("items");
   for(var i=0;i<itemElements.length;i++)
   {
    itemElements[i].checked="checked";
   }
  }
  //全不选
  document.getElementById("checkallNo").οnclick=function(){
   var itemElements=document.getElementsByName("items");
   for(var i=0;i<itemElements.length;i++)
   {
    itemElements[i].checked=null;
   }
  }
  //反选
  document.getElementById("check_revsern").οnclick=function(){
   var itemElements=document.getElementsByName("items");
   for(var i=0;i<itemElements.length;i++)
   {
    var itemElement=itemElements[i];
    if(itemElement.checked){
     itemElements[i].checked=null;
    }else{
     itemElements[i].checked="checked";
    }
   }
  }
}
</script>
</html>

1利用 setAttribute("checked", "checked"); 实现选中,

setAttribute("checked",null); 实现不被选中

2也可以利用

document.getElementById("checkedAll_2").checked = "checked";

实现选中,

3利用 document.getElementById("checkedAll_2").checked = null; 实现不被选中

yuhan20081021

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
JavaScript实现的全选、全不选和反选的代码

//例一无标题文档function sel_all(flag){ //定义标记， var isSel=false; //获取所有的name="aihao" 复选框 var inputobj = document.getElementsByName("aihao"); //根据flag判断用户当前要进行什么操作，flag =1 表示全选 f
复制链接

扫一扫

专栏目录