菜鸡源码,专注精品下载!
当前位置:首页 > 建站教程 > 建站知识

jQuery批量全选和反选操作指南

发布时间:2024-01-05  栏目:建站知识   浏览:   分类:js教程 jquery教程

jQuery批量全选和反选教程:首先,引入jQuery库。然后,使用`$("input[type='checkbox']")`选择所有复选框。接下来,使用`.prop("checked", true)`实现全选功能,使用`.prop("checked", false)`实现反选功能。最后,可以使用`.each()`遍历所有复选框,根据需要执行全选或反选操作。例如,点击全选按钮时,调用全选函数;点击反选按钮时,调用反选函数。这样,就可以实现jQuery批量全选和反选功能。

<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>Document</title></head><body><inputtype="button"value="删除"><tableborder=1><thead><tr><th><inputtype="checkbox"></th><th>2</th><th>3</th><th>4</th></tr></thead><tbody><tr><td><inputtype="checkbox"></td><td>打两份工</td><td>真的很高</td><td><button>删除</button></td></tr><tr><td><inputtype="checkbox"></td><td>打两份工</td><td>真的很高</td><td><button>删除</button></td></tr><tr><td><inputtype="checkbox"></td><td>打两份工</td><td>真的很高</td><td><button>删除</button></td></tr><tr><td><inputtype="checkbox"></td><td>打两份工</td><td>真的很高</td><td><button>删除</button></td></tr><tr><td><inputtype="checkbox"></td><td>打两份工</td><td>真的很高</td><td><button>删除</button></td></tr><tr><td><inputtype="checkbox"></td><td>打两份工</td><td>真的很高</td><td><button>删除</button></td></tr></tbody></table></body><scriptsrc="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script><script>$(function(){$("input[type=button]").click(function(){$("tbody").find("input:checkbox:checked").each(function(){//遍历选中的checkboxn=$(this).parents("tr").index();//获取checkbox所在行的顺序$("tbody").find("tr:eq("+n+")").remove();});});});$(function(){$("thead").find("input[type=checkbox]").click(function(){varflag=$(this).prop("checked");$("tbody").find("input[type=checkbox]").each(function(){//遍历选中的checkbox$(this).prop("checked",flag);});});});</script></html>


评论
建站知识
建站知识
使用技巧
调试安装
运营推广