点击table的tr 使之前的checkbox反选

今天有需求,要做一下这个功能

看了网友给出的几个点击后以改变的变色来判断是否选中,思路也很好,但是确实有局限性

所以自己写了一个,亲测可用,分享给大家!

页面我就不贴了,checkbox在table的第一个单元格内

$("#table").find("tr").click(function (e) {
                        var target = $(e.target);
                        if (!target.is($(this).find(":checkbox"))) {
                            if ($(this).find(":checkbox").is(":checked")) {
                                $(this).find(":checkbox").prop("checked", false)//不选中
                            } else {
                                $(this).find(":checkbox").prop("checked", true)//选中
                            }
                        }
                    })

做一下更正,之前的版本会出现一个问题,当点击tr内的checkbox的时候,则会同时触发 tr的click事件和check的选中事件

导致直接点击checkbox无法被选中

更改后,添加了鼠标点击位置的监控,使两个选中不会同时触发 ,大家可以放心使用!

 

若有疑问,欢迎留言

转载请标明出处:https://blog.youkuaiyun.com/qq_39646675/article/details/86529967