<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <form action="#" method="post"> <input type="text"/> <input type="password"/> <input type="radio"/> <input type="checkbox"/> <input type="image"/> <input type="hidden"/> <input type="file"/> <input type="button"/> <input type="submit"/> <input type="reset"/> <select name="sel" id="sel"> <option>ok</option> </select> <textarea name="ta" id="ta" cols="30" rows="10"></textarea> </form> <button onclick="getformelement()">获取表单元素</button> <br/><br/> <hr/> <br/><br/> <div id="div2"> <input type="checkbox"/>吃饭 <input type="checkbox"/>睡觉 <input type="checkbox"/>打豆豆 </div> <button onclick="chkall()">全选</button> <button onclick="chkno()">全不选</button> <button onclick="chkreverse()">反选</button> <script src="js/jquery-1.12.2.min.js"></script> <script> // 元素的属性值的操作大多数使用attr函数就可以了 // 但是 checked 属性不行,必须使用prop函数 function chkall(){ $("#div2 > :checkbox").prop(‘checked‘, true); } function chkno(){ $("#div2 > :checkbox").prop(‘checked‘, false); } function chkreverse(){ $("#div2 > :checkbox").each(function(i){ this.checked = !this.checked; }); } 这是利用jQuery写出来的全选,全不选,反选按钮,以前是做个这道题的,但是不是用jQuery方法做的,是用的JS做的,写了很多代码,但是我们学习了jQuery过后,写这个代码就容易多了,几行代码就搞定了。
时间: 2024-12-30 04:09:12