您的位置:首页 > Web前端 > JQuery

在jquery用一个按钮实现全选/全不选的效果(attr和prop的区别使用)

2016-11-26 09:19 696 查看
<html>

   <head>

     <script type="text/javascript" src="jquery-2.2.1.min.js"></script>

     <meta charset="utf-8"/>

      <script type="text/javascript">

        var  i=0;

        $(function(){ 

              $("#ss").click( 

                function (){

                
                  $("input[name='fav']").prop("checked","checked");  

//这个地方只能用prop实现多次点击切换全选和全不选的效果,用attr的话不会多次实现。因为attr不会记录当前checkbox的选中状态,所以这个地方只能使用prop

                  if(i==1){ 

                   

                       $("input[name='fav']").prop("checked",false);  

                    

                  }

                  i++;

                  if(i>1){

                    

                    i=0;

                  } 

                  

                } 

              );  

           }

      );

      </script>

   </head>
  

   <body>

       <input type="checkbox"  name="fav"  value="ds"/>读书<br/>

        <input type="checkbox"  name="fav"  value="ds"/>思考<br/>

        <input type="checkbox"  name="fav"  value="ds"/>思考<br/>

        <input type="checkbox"  name="fav"  value="ds"/>睡觉<br/>

       <button id="ss">全选</button>

   </body> 
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery prop html 前端