jquery实现全选和取消全选,jq多选框怎么实现全选

　　本文的运行环境：windows7系统，jquery3.2.1版本3.2.1，DELL G3电脑

　　jquery怎么实现全选效果？

　　jQuery实现全选效果

　　这是一个用jquery实现全选的代码。主要想法如下：

　　1.所有的复选框都有点击事件，所有的效果都是在点击事件下实现的。

　　2.全选复选框实现的功能和其他勾选选项实现的功能是不一样的，所以在点击事件中判断一下是否是全选复选框的点击事件。

　　3.如果是，检查是否选中了“全选”复选框。如果选择了当前状态，单击并取消选中它，同时取消选中所有选项。如果当前未选择全选，请单击并全选。

　　4.如果不是，说明点击的对象是除全选以外的其他选项。然后，需要判断当前选中选项的数量是否等于除全选复选框之外的所有选项的数量。如果相等，说明所有选项都勾选，全选复选框也勾选，否则不勾选。

　　这是我的代码。

　　！声明文档类型

　　超文本标记语言

　　头

　　meta charset=UTF-8

　　标题选择所有效果/标题

　　script src= http://libs . Baidu . com/jquery/2 . 0 . 0/jquery . min . js /script

　　脚本类型=文本/javascript

　　$(function(){

　　$(输入)。单击(函数(){

　　如果($(这个)。index()==0){

　　//判断当前的全选框是否选中，如果是，则全选，否则不选。

　　if($(input )。等式(0)。prop( checked ){

　　$(这个)。nextAll()。prop(checked ，true)；

　　}否则{

　　$(这个)。nextAll()。prop(checked ，false)；

　　}

　　}否则{

　　//确定是否选择了除“全选”之外的所有选项。如果选中，请选中全选，否则，不选。

　　if($(input:gt(0):checked )。length==$(input )。长度-1){

　　$(输入)。等式(0)。属性(已检查，真)

　　}否则{

　　$(输入)。等式(0)。属性(已检查，假)

　　}

　　}

　　})

　　})

　　/脚本

　　/头

　　身体

　　输入类型=复选框/全选

　　输入类型=复选框/语言

　　输入类型=复选框/数学

　　输入类型=复选框/英语

　　/body

　　/html实现全选效果的思路也有很多。这种思路和分开两个点击事件的思路相比有点难以理解，但其实实现效果的代码是一样的。

　　推荐：《jquery视频教程》以上是jquery如何达到全选效果的详细内容。更多请关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。