zoukankan      html  css  js  c++  java
  • html checkbox 实现全选/取消全选

    html checkbox  实现全选/取消全选




    <html>
    <body>
    
    	<table border="1">
    		<tr>
    			<th><input type="checkbox" onclick="swapCheck()" /></th>
    			<th>Month</th>
    			<th>Savings</th>
    		</tr>
    		<tr>
    			<td><input type="checkbox" /></td>
    			<td>January</td>
    			<td>$100</td>
    		</tr>
    		<tr>
    			<td><input type="checkbox" /></td>
    			<td>February</td>
    			<td>$150</td>
    		</tr>
    	</table>
    
    	<script type="text/javascript"
    		src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    
    	<script type="text/javascript">
    		//checkbox 全选/取消全选
    		var isCheckAll = false;
    		function swapCheck() {
    			if (isCheckAll) {
    				$("input[type='checkbox']").each(function() {
    					this.checked = false;
    				});
    				isCheckAll = false;
    			} else {
    				$("input[type='checkbox']").each(function() {
    					this.checked = true;
    				});
    				isCheckAll = true;
    			}
    		}
    	</script>
    
    </body>
    </html>
    



    效果图:



  • 相关阅读:
    JSON
    vue中跳转页面逻辑
    生命周期的几个阶段
    vue学习大纲
    Vue留言 checked框案列
    Vue内容
    linux -- iptables
    linux --- DNS
    linux --- samba
    linux --- vsftp
  • 原文地址:https://www.cnblogs.com/yjbjingcha/p/8316160.html
Copyright © 2011-2022 走看看