当使用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. 微信小程序~事件绑定和冒泡

    [1]事件绑定和冒泡 事件绑定的写法同组件的属性,以 key.value 的形式. key 以bind或catch开头,然后跟上事件的类型,如bindtap.catchtouchstart.自基础库版 ...

  2. jQuery--事件, 事件绑定, 阻止事件冒泡, 事件委托,页面载入后函数

    1.常用事件, 按住shift键实现同步选择效果,搜索框联想效果 2.阻止事件冒泡 3.事件委托 4.使用 $(document).ready(function (){...}) 实现文件加载完绑定事 ...

  3. on绑定阻止冒泡失败

    使用zepto库,有如下dom <div id="J_parent"> <a href="#"> <span>点我有惊喜&l ...

  4. 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解

    在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级   渐进增强(progressive enhancement): 针对低版本浏览器进 ...

  5. javascript的阻止默认事件和阻止冒泡事件

    这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为   在说事件冒泡之前 ...

  6. JS点击子元素不触发父元素点击事件(js阻止冒泡)

    js阻止冒泡 <html> <title></title> <head> <meta charset="utf-8"> ...

  7. DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理

    事件对象——兼容处理 /* * 功能: 事件对象兼容 * 参数: 表示常规浏览器的事件对象e */ function getEvent(e) { // 如果存在e存在,直接返回,否则返回window. ...

  8. (O)阻止默认事件和阻止冒泡的应用场景

    场景1:阻止默认事件   比如这样的一个需求 点击取消a标签按钮的时候会触发一些js动作,但是不能让这个a标签产生跳转行为, 所以需要在点击取消的时候 阻止冒泡,防止其跳转. <a id='ca ...

  9. js添加事件、移除事件、阻止冒泡、阻止浏览器默认行为等写法(兼容IE/FF/CHROME)

    转自:http://blog.csdn.net/itchiang/article/details/7769341 添加事件   var addEvent = function( obj, type, ...

随机推荐

  1. C# socket编程实践

    C# socket编程实践——支持广播的简单socket服务器   在上篇博客简单理解socket写完之后我就希望写出一个websocket的服务器了,但是一路困难重重,还是从基础开始吧,先搞定C# ...

  2. UIWebView的探索

    UIWebView 说到iOS的UIWebView,应该会很快回忆起常用委托方法,异步loadRequest.stopLoading.reload方法等. 在此我总结一些容易忽略的属性和方法: 1.  ...

  3. 推荐系列:最小与最大[DP+余式定理]

    最小与最大 [问题描述] 做过了乘积最大这道题,相信这道题也难不倒你. 已知一个数串,可以在适当的位置加入乘号(设加了k个,当然也可不加,即分成k+1个部分),设这k+1个部分的乘积(如果k=0,则乘 ...

  4. Azure的两种关系型数据库服务:SQL Azure与SQL Server VM的不同

    Azure的两种关系型数据库服务:SQL Azure与SQL Server VM的不同 <Windows Azure Platform 系列文章目录> 如果熟悉Windows Azure平 ...

  5. hive UDAF开发入门和运行过程详解(转)

    介绍 hive的用户自定义聚合函数(UDAF)是一个很好的功能,集成了先进的数据处理.hive有两种UDAF:简单和通用.顾名思义,简单的UDAF,写的相当简单的,但因为使用Java反射导致性能损失, ...

  6. [转]Converting a C library to gyp

    Source:http://n8.io/converting-a-c-library-to-gyp/ Converting a C library to gyp Published: 2012.10. ...

  7. [google面试CTCI] 2-2 找出链表的倒数第n个节点元素

    [链表] Q:Implement an algorithm to find the nth to last element of a singly  linked list . 题目:找出链表的倒数第 ...

  8. Google开源的Deep-Learning项目word2vec

    用中文把玩Google开源的Deep-Learning项目word2vec   google最近新开放出word2vec项目,该项目使用deep-learning技术将term表示为向量,由此计算te ...

  9. AOP的成员介绍

    AOP(Aspect Oriented Programming)面向切面编程,AOP的作用不过多介绍,本文是主要是介绍AOP的成员,是我在复习的时候记录的一些笔记,方便以后查阅方便一些. JointP ...

  10. spring实现数据库读写分离

    现在大型的电子商务系统,在数据库层面大都采用读写分离技术,就是一个Master数据库,多个Slave数据库.Master库负责数据更新和实时数据查询,Slave库当然负责非实时数据查询.因为在实际的应 ...