zepto.js中tap事件阻止冒泡的实现方法
作者:bea
本文实例讲述了zepto.js中tap事件阻止冒泡的实现方法。分享给大家供大家参考。具体如下: 最近在弄一个手机版的网站,本来想用jQuery Mobile,但文件太大了,所以用了zepto.js 由于移动网页中使用click事件会有延迟,所以就用上了zepto.js中的tap事件。 使用click事件可以使用stopPropagation来阻止冒泡,但tap使用该方法无效 现在我需要实现这样一个效果:点击a.btn这个按钮,然后显示div.panel,当我点击非div.pa
本文实例讲述了zepto.js中tap事件阻止冒泡的实现方法。分享给大家供大家参考。具体如下:
最近在弄一个手机版的网站,本来想用jQuery Mobile,但文件太大了,所以用了zepto.js
由于移动网页中使用click事件会有延迟,所以就用上了zepto.js中的tap事件。
使用click事件可以使用stopPropagation来阻止冒泡,但tap使用该方法无效
现在我需要实现这样一个效果:点击a.btn这个按钮,然后显示div.panel,当我点击非div.panel时隐藏div.panel
$("a.btn").on("tap",function(e){
e.stopPropagation();//该方法不起作用
$("div.panel").show();
});
$(document).on("tap",function(e){
$("div.panel").hide();
});
通过调试工具,得到e这个对象中有一个target属性,于是可以通过该属性来实现所需要的效果:
$("a.btn").on("tap",function(){
$("div.panel").show();
});
$(document).on("tap",function(e){
if(!$(e.target).hasClass("btn")){
$("div.panel").hide();
}
});
这样算是解决了
希望本文所述对大家的javascript程序设计有所帮助。
猜你喜欢
您可能感兴趣的文章:
- javascript转换日期字符串为Date日期对象的方法
- jQuery动态修改超链接地址的方法
- jQuery实现contains方法不区分大小写的方法
- javascript获取元素离文档各边距离的方法
- jQuery点缩略图弹出层显示大图片
- Js控制滑轮左右滑动实例
- JavaScript函数作用域链分析
- JavaScript匿名函数用法分析
- js实现进度条的方法
- NodeJs基本语法和类型
- 动态加载js的方法汇总
- jQuery EasyUI datagrid实现本地分页的方法
- jQuery向后台传入json格式数据的方法
- 浅谈轻量级js模板引擎simplite
- js实现拖拽效果
- jQuery多个input求和的实现方法
- JQuery实现防止退格键返回的方法
- JavaScript自定义数组排序方法
- nodejs事件的监听与触发的理解分析