on事件绑定阻止冒泡的问题
当使用on进行事件绑定时当要给document绑定click,而子元素要禁止冒泡,那么子元素里面的子元素的click事件就会无效了,
下面无效版:
$('#queue').on('click', '.link', function() {
var t = $(this)
,box = t.next()
if(t.hasClass('active')) {
box.hide()
t.removeClass('active')
}
else {
box.show()
t.addClass('active')
}
event.stopPropagation()
})
//排队列表收缩
$(document).on('click','body',function(){
$('.link').removeClass('active')
$('.queue-box').hide();
})
$('#queue').on('click','.queue-box',function(){//绑 $('#queue')或 $(document)都一样
event.stopPropagation()
//主要是下面
$(document).on('click','.btn-queue-join',function(){
mywebsocket.send(JSON.stringify({
"action": "patientJoinQueue",
"patientCode": patientCode,
"orderCode": $(this).parents('.item').attr('data-id')
}))
});
//修改$(document)为$('.queue-box')就可以了
$('.queue-box').on('click','.btn-queue-join',function(){
mywebsocket.send(JSON.stringify({
"action": "patientJoinQueue",
"patientCode": patientCode,
"orderCode": $(this).parents('.item').attr('data-id')
}))
});
参考http://www.cnblogs.com/tengj/p/4794947.html对其进行了理解
暂时没空后面补理解
on事件绑定阻止冒泡的问题的更多相关文章
- 微信小程序~事件绑定和冒泡
[1]事件绑定和冒泡 事件绑定的写法同组件的属性,以 key.value 的形式. key 以bind或catch开头,然后跟上事件的类型,如bindtap.catchtouchstart.自基础库版 ...
- jQuery--事件, 事件绑定, 阻止事件冒泡, 事件委托,页面载入后函数
1.常用事件, 按住shift键实现同步选择效果,搜索框联想效果 2.阻止事件冒泡 3.事件委托 4.使用 $(document).ready(function (){...}) 实现文件加载完绑定事 ...
- on绑定阻止冒泡失败
使用zepto库,有如下dom <div id="J_parent"> <a href="#"> <span>点我有惊喜&l ...
- 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解
在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级 渐进增强(progressive enhancement): 针对低版本浏览器进 ...
- javascript的阻止默认事件和阻止冒泡事件
这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为 在说事件冒泡之前 ...
- JS点击子元素不触发父元素点击事件(js阻止冒泡)
js阻止冒泡 <html> <title></title> <head> <meta charset="utf-8"> ...
- DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理
事件对象——兼容处理 /* * 功能: 事件对象兼容 * 参数: 表示常规浏览器的事件对象e */ function getEvent(e) { // 如果存在e存在,直接返回,否则返回window. ...
- (O)阻止默认事件和阻止冒泡的应用场景
场景1:阻止默认事件 比如这样的一个需求 点击取消a标签按钮的时候会触发一些js动作,但是不能让这个a标签产生跳转行为, 所以需要在点击取消的时候 阻止冒泡,防止其跳转. <a id='ca ...
- js添加事件、移除事件、阻止冒泡、阻止浏览器默认行为等写法(兼容IE/FF/CHROME)
转自:http://blog.csdn.net/itchiang/article/details/7769341 添加事件 var addEvent = function( obj, type, ...
随机推荐
- twobin博客样式
twobin博客样式—“蓝白之风” 自暑假以来,囫囵吞枣一般蒙头栽入前端自学中,且不说是否窥探其道,却不自觉中提高了对网页版面设计的要求,乃至挑剔.一个设计清爽美观的网页能让读者心旷神怡,甚至没有 ...
- poj1183 反正切函数的应用(水)
这一题主要是推导过程+注意一下范围. // 由公式4你可以得到: arctan(/a)=arctan[(/b+/c)/(-/b*c)] =>b*c-=a(b+c); 令 b=a+m,c=a+n; ...
- Nginx 配置基于域名的虚拟
编辑配置文件 vi /etc/nginx/nginx.conf user www www; worker_processes 2; error_log logs/error.log not ...
- XDCTF 2013 code2 跳出死循环
题目:编写一个程序(比如kernel module),使附件2.c中的程序跳出死循环.2.c中的代码如下:#include int main(int argc, char *argv[]){int n ...
- 通过实体反射实现CriteriaQuery并列条件查询
将实体反射之后获取查询字段的值,并添加到Predicate对象数组中 public Predicate getPredicateAnd(T entity, Root<T> root, Cr ...
- Visual Studio 2012的开发使用技巧
分享10条Visual Studio 2012的开发使用技巧 使用Visual Studio 2012有一段时间了,并不是追赶潮流,而是被逼迫无可奈何.客户要求的ASP.NET MVC 4的项目,要用 ...
- 最新FFMPEG解码流程
FFMPEG解码流程: 1. 注册所有容器格式和CODEC: av_register_all() 2. 打开文件: av_open_input_file() 3 ...
- 调用一个Activity并返回结果
一:在main.xml文件中设置布局 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&q ...
- 先对数组排序,在进行折半查找(C++)
第一步:输入15个整数 第二步:对这15个数进行排序 第三部:输入一个数,在后在排好序的数中进行折半查找,判断该数的位置 实现代码如下: 方法一: 选择排序法+循环折半查找法 #include< ...
- 使用DBUnit实现对数据库的测试
这是一个JavaProject,有关DBUnit用法详见本文测试用例 首先是用到的实体类User.java package com.jadyer.model; public class User { ...