jquery實現全選 反選 取消
阿新 • • 發佈:2018-11-07
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="button" value="全選" onclick="checkAll()"> <input type="button" value="反選" onclick="reserveAll()"> <input type="button" value="取消" onclick="cancleAll()"> <table border="1"> <thread> <th>選項</th> <th>姓名</th> <th>學號</th> </thread> <tbody> <tr> <td><input type="checkbox"></td> <td>大眼俠</td> <td>1001</td> </tr> <tr> <td><input type="checkbox"></td> <td>大眼俠</td> <td>1001</td> </tr> <tr> <td><input type="checkbox"></td> <td>大眼俠</td> <td>1001</td> </tr> <tr> <td><input type="checkbox"></td> <td>大眼俠</td> <td>1001</td> </tr> <tr> <td><input type="checkbox"></td> <td>大眼俠</td> <td>1001</td> </tr> </tbody> </table> <script src="jquery1.9.js"></script> <script> functioncheckAll() { $(":checkbox").prop("checked",true); } function cancleAll() { $(":checkbox").prop('checked',false); } function reserveAll() { $(":checkbox").each(function () { var v=$(this.checked)? false:true; $(this).prop('checked',v); }) } </script> </body> </html>