【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/

时间: 2024-12-18 01:30:09

【Javascript】重新绑定默认事件的相关文章

javascript, jQuery阻止默认事件和冒泡事件

事件冒泡(event bubbling) 事件冒泡是指一个元素上的事件被触发,然后这个事件按嵌套顺序在父级元素上触发,直至document根节点. 例如: <!DOCTYPE html> <html> <head> <title>Event Bubbling Example</title> </head> <body> <div id="myDiv">Click Me</div>

看懂此文,不再困惑于javascript中的事件绑定、事件冒泡、事件捕获和事件执行顺序

最近一个项目基于3维skyline平台,进行javascript二次开发.对skyline事件的设计真是无语至极,不堪折磨啊!抽空学习了下javascript和jquery的事件设计,收获颇大,总结此贴,和大家分享. (一)事件绑定的几种方式 javascript给DOM绑定事件处理函数总的来说有2种方式:在html文档中绑定.在js代码中绑定.下面的方式1.方式2属于在html中绑定事件,方式3.方式4和方式5属于在js代码中绑定事件,其中方法5是最推荐的做法. 方式1: HTML的DOM元素

javascript事件之: 事件冒泡, 事件捕获 ,阻止默认事件

谈起JavaScript的 事件,事件冒泡.事件捕获.阻止默认事件这三个话题,无论是面试还是在平时的工作中,都很难避免. 冒泡篇: 先来看一段实例: js: var $input = document.getElementsByTagName("input")[0]; var $div = document.getElementsByTagName("div")[0]; var $body = document.getElementsByTagName("

理解Javascript中的事件绑定与事件委托

最近在深入实践js中,遇到了一些问题,比如我需要为动态创建的DOM元素绑定事件,那么普通的事件绑定就不行了,于是通过上网查资料了解到事件委托,因此想总结一下js中的事件绑定与事件委托. 事件绑定   最直接的事件绑定:HTML事件处理程序 如下示例代码,通过节点属性显式声明,直接在HTML中,显式地为按钮绑定了click事件,当该按钮有用户点击行为时,便会触发myClickFunc方法. /* html */ <button id="btn" onclick="myCl

JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题

javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbind('click').click(function(){ //此处填写逻辑代码 }) ------ 因为利用js在页面加载后添加需要点击事件的代码,发现在点击后会代码会执行两次,因为有toggle效果,导致弹窗出现又很快丢失 查了一些资料,发现这是冒泡的原因,需要在点击事件代码中加入阻止冒泡的方法: e.s

javascript中常用的事件绑定方法

我们要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有三种常用的绑定事件的方法: 在DOM元素中直接绑定: 在JavaScript代码中绑定: 绑定事件监听函数. 一. 在DOM元素中直接绑定 这里的DOM元素,可以理解为HTML标签.JavaScript支持在标签中直接绑定事件,语法为:    onXXX="JavaScript Code" 其中

2014年辛星解读Javascript之DOM之事件及其绑定

我们通过DOM的事件能够对HTML的事件作出反应.就像我们用其它编程语言写GUI一样,那么HTML包含哪些事件呢?以下是几个常见的样例,比方网页已经完毕记载,图像完毕载入,鼠标移动到元素上方.输入文字被改变.表单提交.用户点击按键等等,还是蛮多的. 以下我们用实例来演示一下,看以下的HTML代码: <html> <p id = "tag" onclick="this.innerHTML ='小倩' ">辛星</p> </ht

超链接标签绑定JS事件&amp;&amp;不加&quot;javascript:;&quot;导致的杯具

很久以来,在写Html和JS时,经常会给超链接<a>标签,绑定JS事件. 我们经常看到这样的写法,<a href="javascript:;" onclick="doAction()" >Click</a>. 我原来一直有个疑问,干嘛非要加上"javascript:;" .原来,我很"老实",每次都会加上.今天,又手敲了类似的代码,本着"老子就是不加,你咬我"的得瑟心态,

事件绑定和阻止默认事件

5月29,30日 终于到了这一天.晚上有数据结构课,10点多的火车,我们就没有去上课,下午在宿舍里收拾东西,晚上8点左右从南校出发,9点半多到达火车站和老师学长学姐们会和. 第一次去北京,第一次买的卧铺,真的很兴奋.对这次北京之行满满的都是期待.卧铺,躺在上面很舒服,因为第一次,不知道还需要换票,就把票放在包里了,找了一会才找到,看来还是得把票随身带着.卧铺晚上熄灯,我看了一部电影,然后就睡着了,一觉睡到五点多.上午看了看模板,这次蓝桥杯决赛说实话没有怎么认真的准备,做的题也比较少.把一些小的知