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, ...
随机推荐
- ASP.NET(支持 ASP.NET MVC)性能优化包 - combres 介绍
项目地址:https://github.com/buunguyen/combres Overview Combres (previously hosted in CodePlex) helps you ...
- Couchbase集群和Redis集群解析
Couchbase集群和Redis集群解析 首先,关于一些数据库或者是缓存的集群有两种结构,一种是Cluster;一种是master-salve. 关于缓存系统一般使用的就是Redis,Redis是开 ...
- html5实现饼图和线图
html5实现饼图和线图-我们到底能走多远系列(34) 我们到底能走多远系列(34) 扯淡: 送给各位一段话: 人生是一个不断做加法的过程 从赤条条无牵无挂的来 到学会荣辱羞耻 ...
- Django 源码小剖: 初探 WSGI
Django 源码小剖: 初探 WSGI python 作为一种脚本语言, 已经逐渐大量用于 web 后台开发中, 而基于 python 的 web 应用程序框架也越来越多, Bottle, Djan ...
- 总结C++中取成员函数地址的几种方法
这里, 我整理了4种C++中取成员函数地址的方法, 第1,2,4种整理于网上的方法, 第3种cdecl_cast是我自己想到的. 其中, 第4种(汇编)的方法不能在VC6上编译通过. 推荐使用第1,2 ...
- 依赖注入(DI)和Ninject
[ASP.NET MVC 小牛之路]04 - 依赖注入(DI)和Ninject 本文目录: 1.为什么需要依赖注入 2.什么是依赖注入 3.使用NuGet安装库 4.使用Ninject的一般步骤 5. ...
- DIV+CSS命名参考
用了一段CSS布局设计网页,发现自己的命名有点混乱,完全按照自己的想法命名,虽然没什么影响,有不给别人看源文件,但是工作室有时候和团队合作完成项目的时候,就遇到麻烦了,要修改一个地方相当的费事.所以还 ...
- Centos6.3不能使用yum install安装gcc编辑器解决办法
mv /var/lib/rpm/__db* /tmp rpm --rebuilddb yum clean all
- Dispose模式
Dispose模式 Dispose模式是.NET中很基础也很重要的一个模式,今天重新复习一下相关的东西并记录下来. 什么是Dispose模式? 什么时候我们该为一个类型实现Dispose模式 使用Di ...
- 排序算法用C++的基本算法实现十个数排序
本文个人在青岛喝咖啡的时候突然想到的...近期就有想写几篇关于排序算法的文章,所以回家到之后就奋笔疾书的写出来发布了 冒泡排序法 道理: 它重复地访问过要排序的数列,一次比较两个元素,如果他们的顺序错 ...