点击tr实现选择checkbox功能,点击checkobx的时候阻止冒泡事件, jquery给checkbox添加checked属性或去掉checked属性不能使checkobx改变状态
给tr添加点击事件,使用find方法查找tr下的所有层级的元素,children只查找下一层级的元素,所以使用find。
find的返回值为jquery对象,在这个项目中不知道为什么使用jquery给checkbox添加checked属性或去掉checked属性不能使checkobx改变状态,所以我就把jquery对象转换为DOM对象,怎么转呢?jquery对象[0]或者get(0)就转换成DOM对象,然后直接.checked返回true或false就可以判断checkbox是否选中了。然后判断状态,改变状态。
$("tr").click(function(e){
var check = $(this).find("input[type='checkbox']");
if(check){
var flag = check[0].checked;
if(flag){
check[0].checked = false;
}else{
check[0].checked = true;
}
}
});
到这还没有结束,当点击checkbox的时候出现了问题。是因为点击checkbox的时候同时也点击了tr,所以checkbox的状态只是闪一下,没有改变。要解决这个问题使用下面代码就可以实现。给checkbox添加阻止冒泡事件,三行代码就搞定了。
$("input[type='checkbox']").click(function(e){
e.stopPropagation();
});
解决 jquery给checkbox添加checked属性或去掉checked属性不能使checkobx改变状态 除了转换成dom外还可以
$(".list-msg li").click(function(){
obj=$(this).find("input[type=checkbox]");
//alert(obj.is(":checked"))
if(obj.is(":checked")){
obj.prop("checked", false)
}else{
obj.prop("checked", true)
}
})
jquery 1.6以上版本 设置boolean值的属性时要用prop。而不是attr
点击tr实现选择checkbox功能,点击checkobx的时候阻止冒泡事件, jquery给checkbox添加checked属性或去掉checked属性不能使checkobx改变状态的更多相关文章
- 页面内部DIV让点击外部DIV 事件不发生(阻止冒泡事件)
如标题的情况,经常发生,尤其是在一些弹出框上面之类的. <script> function zuzhimaopao(){ e.stopPropagation(); } </scrip ...
- js实现冒泡事件,点击ul给子标签添加相同事件和阻止冒泡事件
$('#LocalLife_PopUp_layer').find('.SelectCity_Cont ul').click(function(e){ var e=e||windo ...
- jquery鼠标点击窗口或浮动层以外关闭层【阻止冒泡事件】
$(".up-list a.th1").click(function(){ $(this).next("ul#up-list-ul").show(); }); ...
- js 冒泡事件 点击任意地方隐藏元素
$(function () { $("#but").click(function (e) {// $();//显示速度 /*阻止冒泡事件*/ e = window.event || ...
- jQuery操作checkbox选择
1.checkbox list选择 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...
- 点击tableViewCell,调用打电话的功能
对于点击tableViewCell,调用打电话的功能,按照一般的方法,使用Appdelegate的OpenUrl的方法,使用前先使用UIAlertView展示,让用户选择是否拨打,但是发现了个简单的方 ...
- Vue实现仿淘宝商品详情属性选择的功能
Vue实现仿淘宝商品详情属性选择的功能 先看下效果图:(同个属性内部单选,属性与属性之间可以多选) 主要实现过程: 所使用到的数据类型是(一个大数组里面嵌套了另一个数组)具体格式如下: attrA ...
- input选中 和 select点击下拉选择获取选中选项的值
1.input选中$('#checkBox').find('input').each(function(i){ if($(this).prop('checked')){//获取是否选中 并判断 $(t ...
- Vue -- element-ui el-table 点击tr项页面跳转,返回后缓存回显点击项
页面跳转反显(点击项,点击table滚动的位置,搜索条件,分页回显) 点击table tr项后,页面跳转到下级页面,返回回显搜索条件.当前页码.并将点击项select选中.滚动条也被记录回显跳转时滚动 ...
随机推荐
- BZOJ 1047: [HAOI2007]理想的正方形 单调队列瞎搞
题意很简明吧? 枚举的矩形下边界和右端点即右下角,来确定矩形位置: 每一个纵列开一个单调队列,记录从 i-n+1 行到 i 行每列的最大值和最小值,矩形下边界向下推移的时候维护一下: 然后在记录的每一 ...
- BZOJ3622(容斥+dp)
思路 "恰k个"考虑求至少k.k+1--个容斥 题面说所有数字都不同,可以将所求转化为糖比药多的组数恰为\((n+k)/2\)的方案数 \(f[i][j]\)数组我觉得更好的理解方 ...
- Spring注入bean和aop的注意事项
spring注入类没有构造函数,注入成功抽象类,注入失败不写bean注入的名字,默认是bean第一个字母小写的名字,但是bean名字开头是两个大写,则默认是bean的名字前面所有大写都变小写@Auto ...
- D. Restructuring Company 并查集 + 维护一个区间技巧
http://codeforces.com/contest/566/problem/D D. Restructuring Company time limit per test 2 seconds m ...
- Windows下用cpu模式跑通目标检测py-faster-rcnn 的demo.py
关键字:Windows.cpu模式.Python.faster-rcnn.demo.py 声明:原文发表在博客园,未经允许不得转载!!!本篇blog过程已经多名读者实践验证,有人反馈报错TypeErr ...
- nginx的基本操作
启动 nginx -c /etc/nginx/nginx.conf停止nginx -s stop nginx -s quit pkill -9 nginx重载nginx -s reload文件检测ng ...
- c# 类名不同,字段相同,如何快速给类赋值
1,相关的两个类如下:现在我们知道短信的值,如何给微信来赋值呢,需要用到我们的反射,当然字段一一赋值也可以,但是如果字段有100个,这个方法就不行啦 /// <summary> /// 短 ...
- Java基础知识 ——JDK,JRE和JVM
1.开发简单的Java程序过程: 名词解释: JDK:JDK是 Java 语言的软件开发工具包,主要用于移动设备.嵌入式设备上的java应用程序.JDK是整个java开发的核心,它包含了JAVA的运行 ...
- java初探之初始化
首先明确,变量初始化是在任何方法(包括构造器)被调用之前进行的. 1.实例变量的初始化 实例变量只有当它所属的类实例化后才会存在,构造器被执行就意味着对象就被创建. 1.1.指定初始化. class ...
- hashlib(加盐)回炉练习
简介: 用于加密相关的操作,代替了md5模块和sha模块,主要提供SHA1,SHA224,SHA256,SHA384,SHA512,MD5算法.在python3中已经废弃了md5和sha模块,简单说明 ...