【Javascript】重新绑定默认事件
更多内容,请移步 JSCON-简时空
在有一种场景下,你想先屏蔽掉默认的系统事件,而在特定条件下又重新绑定回去。
【场景】H5页面,动画欢迎界面,共6帧;想在前5帧中屏蔽掉默认的touchmove事件,在第6帧是表单页面,想恢复系统默认的touchmove——这样用户可以自由拖拽页面,浏览完整的表单信息
原生JS:
目前我所能想到的最简单粗暴有效的方法是这样的:(没错,it works)
document.ontouchmove = function(e){return false;}
if(index == 5){
document.ontouchmove = function(e){return true;};
}
jQuery:
有jQuery的日子才是好日子,使用jQuery你将变得更加的强大。任何一个元素将事件的原有事件handler
放在data-events
属性中。所以你在调用unbind
方法时,将其存储到一个变量中即可:(注意事件对象是一个数组)
var events = $('#test').data("events");
$('#test').unbind('click', events.click[0]);
或者:
var storedClick = $test.data('events').click[0].handler;
$test.bind('click', storedClick)
原理:jQuery: Unbind event handlers to bind them again later
实例:http://jsfiddle.net/76GPF/
【Javascript】重新绑定默认事件的更多相关文章
- JavaScript 回车键绑定登录 事件 常用键位码(keyCode)
1.回车键绑定登录事件 $(document).keydown(function (e) { if ((e.keyCode || e.which) == 13) { //document.queryS ...
- javascript的阻止默认事件和阻止冒泡事件
这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为 在说事件冒泡之前 ...
- 前端(十五)—— JavaScript事件:绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件
JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...
- JavaScript事件冒泡机制和阻止事件冒泡及默认事件
一.阻止事件冒泡: 1.html中加return false 2.js中加return false 3.IE下:window.event.cancelBubble = true: FF下:event ...
- 理解Javascript中的事件绑定与事件委托
最近在深入实践js中,遇到了一些问题,比如我需要为动态创建的DOM元素绑定事件,那么普通的事件绑定就不行了,于是通过上网查资料了解到事件委托,因此想总结一下js中的事件绑定与事件委托. 事件绑定 ...
- 第一百三十六节,JavaScript,封装库--事件绑定
JavaScript,封装库--事件绑定 在函数库添加两个函数 添加事件绑定函数 删除事件绑定函数 添加事件绑定函数 /** addEvent()函数库函数,跨浏览器添加事件绑定,注意:传入事件名称时 ...
- 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解
在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级 渐进增强(progressive enhancement): 针对低版本浏览器进 ...
- JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题
javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...
- JavaScript事件:事件处理模型(冒泡、捕获)、取消冒泡、阻止默认事件
(一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div clas ...
随机推荐
- 判断一个 int 向量里是否有相同的数(1)
class Solution { public: bool containsDuplicate(vector<int>& nums) { map<int,char> e ...
- [已解决] No syntax specified for the proto file : xxx.proto
在使用protobuf生成相应类文件如java文件的时候需要指定proto的版本, 如: syntax = "proto2"; package my_package; messag ...
- java中递归的方法的实例
package com.demo.recursion; // 所谓递归,是指程序调用自身,当然,递归不会无休止地调用下去,它必然有一个出口,当满足条件时程序也就结束了,不然的话,那就是死循环了.// ...
- [OSG]OSG例子程序简介
1.example_osganimate一)演示了路径动画的使用(AnimationPath.AnimationPathCallback),路径动画回调可以作用在Camera.CameraView.M ...
- 我所理解的ECMAScript、DOM、BOM---写给新手们
像很多新手一样,我知道js有三部分组成,即ECMAScript.DOM.BOM三部分组成,ECMAScript是核心解释器.DOM(Document Object Model)是文档对象模型.BOM( ...
- Android守护进程
这几天,一位做Android的朋友和我探讨了一个问题:因为业务需求的原因,在自己的App长时间不使用被kill掉之后,如何让它再重新运行起来. 虽然,我本身很排斥这种做法,有点类似“流氓软件”的行为, ...
- webapi mvc session一直获取不到问题
前一段时间在给移动端写接口时遇到一个调用接口发送邮箱 session 一直获取不到的问题.我来给遇到问题的同志们说一说 自个在网上查了好多资料,问了一些朋友后.终于找到解决方案了. 大家都知道weba ...
- angular中不同controller传值问题
利用angularJS中service单例模式的特性,服务(service)提供了一种能在应用的整个生命周期内保持数据的方式,能够在控制器之间进行通信,且能保证数据的一致性. 一般我们都会封装serv ...
- Flesch Reading Ease -POJ3371模拟
Flesch Reading Ease Time Limit: 1000MS Memory Limit: 65536K Description Flesch Reading Ease, a reada ...
- 个人作业-Week2 案例分析
微软必应词典客户端的案例分析 第一部分 调研,评测 1)bug: 运行平台:iOS 10.0.2 必应词典版本:4.2.2 1. bug标题:词库加载错误 bug详细描述:学习界面中的经典词库出国考试 ...