表格全选取消反选
Posted yspass
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了表格全选取消反选相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="button" value="全选" onclick="selectAll();"/> <input type="button" value="取消" onclick="cancelAll();"/> <input type="button" value="反选" onclick="reverseAll();"/> <table border="1px"> <tr> <th>ID</th> <th>IP</th> <th>Port</th> <th>操作</th> </tr> <tr> <td>1</td> <td>192.168.1.1</td> <td>3306</td> <td><input type="checkbox" class="chk"></td> </tr> <tr> <td>2</td> <td>192.168.2.1</td> <td>3307</td> <td><input type="checkbox" class="chk"></td> </tr> <tr> <td>3</td> <td>192.168.21.1</td> <td>3369</td> <td><input type="checkbox" class="chk"></td> </tr> </table> <script> function selectAll() { var inpts = document.getElementsByClassName(‘chk‘); for (var i = 0; i < inpts.length; i=i+1) { inpts[i].checked = true; } }; function cancelAll() { var inpts = document.getElementsByClassName(‘chk‘); for (var i = 0; i < inpts.length; i++) { inpts[i].checked = false; } }; function reverseAll() { var inpts = document.getElementsByClassName(‘chk‘); for (var i = 0; i < inpts.length; i++) { if (inpts[i].checked) { inputs[i].checked = false; }else { inpts[i].checked = true; } } }
以上是关于表格全选取消反选的主要内容，如果未能解决你的问题，请参考以下文章
使用Easyui ,表格表头的复选框怎么实现全选和取消全选的功能，