jQuery菜单实例(全选,反选,取消)

来源：懂视网责编：小采时间：2020-11-27 22:31:35

jQuery菜单实例(全选,反选,取消)

jQuery菜单实例(全选,反选,取消):废话不多说，直接上代码 <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>Document</title> </head> <body> <input t

推荐度：

点击下载本文 文档为doc格式

导读jQuery菜单实例(全选,反选,取消):废话不多说，直接上代码 <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>Document</title> </head> <body> <input t

废话不多说，直接上代码

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
</head>
<body>
 <input type="button" value="全选" onclick="checkAll()">
 <input type="button" value="反选" onclick="reverseAll()">
 <input type="button" value="取消" onclick="cancleAll()">
 <table border="1">
 <thead>
 <tr>
 <th>选择</th>
 <th>IP</th>
 <th>端口</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td><input type="checkbox"></td>
 <td>1.1.1.1</td>
 <td>80</td>
 </tr>
 <tr>
 <td><input type="checkbox"></td>
 <td>1.1.1.1</td>
 <td>80</td>
 </tr>
 <tr>
 <td><input type="checkbox"></td>
 <td>1.1.1.1</td>
 <td>80</td>
 </tr>
 <tr>
 <td><input type="checkbox"></td>
 <td>1.1.1.1</td>
 <td>80</td>
 </tr>
 <tr>
 <td><input type="checkbox"></td>
 <td>1.1.1.1</td>
 <td>80</td>
 </tr>
 </tbody>

 </table>
 <script type="text/javascript" src='jquery-3.2.1.js'></script>
 <script type="text/javascript">
 function checkAll(){
 $(':checkbox').prop('checked',true);
 }
 function cancleAll() {
 $(':checkbox').prop('checked',false);
 }
 function reverseAll(){
 $(':checkbox').each(function(){
 var v = $(this).prop('checked')? false:true; /*三元运算： var v = 条件? 真值:假值*/
 $(this).prop('checked',v)
 })
 }
 </script>
</body>
</html>

以上这篇jQuery菜单实例(全选,反选,取消)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

jQuery菜单实例(全选,反选,取消)

jQuery菜单实例(全选,反选,取消):废话不多说，直接上代码 <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>Document</title> </head> <body> <input t

推荐度：

点击下载本文 文档为doc格式

标签：取消菜单全选

热门焦点

jQuery菜单实例(全选,反选,取消)

jQuery菜单实例(全选,反选,取消)

jQuery菜单实例(全选,反选,取消)

最新推荐

猜你喜欢

热门推荐