jQuery的全选、全不选、

最新推荐文章于 2024-05-13 02:03:57 发布

ajr13141618

最新推荐文章于 2024-05-13 02:03:57 发布

阅读量107

点赞数

文章标签： jQery的全选、全不选、反选

本文链接：https://blog.csdn.net/ajr13141618/article/details/82905292

版权

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>SelectAll</title>
 <script type="text/javascript" src="jquery-3.3.1/jquery-3.3.1.js"></script>
 <script type="text/javascript">
     $(function () {          
         $("#selectAll").click(function () {            
             $("#playList :checkbox").prop("checked", true);            
         });             
         $("#unSelect").click(function () {               
             $("#playList :checkbox").prop("checked", false);            
         });             
         $("#reverse").click(function () {               
             $("#playList :checkbox").each(function () {    
              $(this).prop("checked", !$(this).prop("checked"));                
              });            
         });        
        });    
    </script>
</head>
<body>   
    <div id="playList">       
        <input type="checkbox" value="演员" />演员<br />
        <input type="checkbox" value="绅士" />绅士<br />
     <input type="checkbox" value="刚刚好" />刚刚好<br />   
     <input type="checkbox" value="方圆几里" />方圆几里<br />
     <input type="checkbox" value="认真的雪" />认真的雪<br /> 
     <input type="checkbox" value="初学者" />初学者    
    </div>    
    <input type="button" value="全选" id="selectAll" />    
    <input type="button" value="全不选" id="unSelect" />    
    <input type="button" value="反选" id="reverse" />
</body>
</html>