Home >Web Front-end >HTML Tutorial >html checkbox implements all selection/cancel selection_html/css_WEB-ITnose
html checkbox implements all selection/cancel selection_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:42:161311browse
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>
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn