jQuery中全选和反选

最新推荐文章于 2024-01-23 19:19:19 发布

scvas

最新推荐文章于 2024-01-23 19:19:19 发布

阅读量297

点赞数

本文链接：https://blog.csdn.net/wuzhanbin/article/details/77916371

版权

html 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

jQuery中全选和反选

用DW编写的，需要导入js库文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>6单元全选和反选</title>
<script type="text/javascript" src="../jQuery/jquery-2.1.0.js"></script>
<script type="text/javascript">
function quanxuan(){
      //全选
   var vah=$(".ah")
   for(var i=0;i<vah.length;i++){
       //checked为true时就选中
       vah[i].checked=true

       }
   }
    //反选
function fanxuan(){
   var vah=$(".ah")
   for(var i=0;i<vah.length;i++){
       if(vah[i].checked==true){
       //checked为false时就不选
       vah[i].checked=false
           }else{
       //checked为true时就选中
       vah[i].checked=true

           }
           }
       }
    //取消
function quxiao(){

   var vah=$(".ah")
   for(var i=0;i<vah.length;i++){
       //checked为false时就取消
       vah[i].checked=false
       }
      }

</script>
</head>

<body>
<input type="button" value="全选" οnclick="quanxuan()" />
<input type="button" value="反选" οnclick="fanxuan()" />
<input type="button" value="取消" οnclick="quxiao()" /><br />

爱好：<input type="checkbox" class="ah" />吃
     <input type="checkbox" class="ah"/>喝
     <input type="checkbox" class="ah"/>玩
      <input type="checkbox" class="ah"/>乐

</body>
</html>