1 添加事件
var addEvent = (function () { if (document.addEventListener) { return function (el, type, fn) { //FF el.addEventListener(type, fn, false); }; } else { return function (el, type, fn) { el.attachEvent('on' + type, function () { //alert( "addEvent ======== "+obj["on"+type] ); //IE return fn.call(el, window.event); }); } } })();
2 移除事件
var removeEvent = function( obj, type, fn ) { if (obj.removeEventListener) //FF obj.removeEventListener( type, fn, false ); else if (obj.detachEvent) { //IE obj.detachEvent( "on"+type,fn ); //obj["on"+type] = null; //alert("removeEvent ======== "+ obj["on"+type] ); } };
3 窗体加载事件
var loadEvent = function(fn) { var oldonload = window.onload; // alert("loadEvent========== "+ (typeof window.onload =='function' )); if (typeof window.onload != 'function') {//这一句还不知道啥意思 window.onload = fn; }else { window.onload = function() { oldonload(); fn(); } } }
4 阻止dom的默认事件执行
var stopEvent = function(e){ e = e || window.event; if(e.preventDefault) { e.preventDefault(); //FF e.stopPropagation(); }else{ e.returnValue = false; //IE e.cancelBubble = true; } }
使用例子:
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JS阻止链接跳转</title> <script type="text/javascript"> //对于这个例子超链接,点击的时候只执行单击事件,而不会执行超链接 var stopDefault = function(e){ e = e || window.event; if(e.preventDefault) { //FF e.preventDefault(); e.stopPropagation(); }else{ //IE e.returnValue = false; e.cancelBubble = true; } } </script> </head> <body> <a href="http://www.baidu.com" id="testLink">百度</a> <script type="text/javascript"> var test = document.getElementById('testLink'); test.onclick = function(e) { alert('我的链接地址是:' + this.href + ', 但是我不会跳转。'); stopDefault(e); } </script> </body>
5 阻止冒泡
var stopPropagation = function(e) { e = e || window.event; if (!+"\v1") { e.cancelBubble = true; } else { e.stopPropagation(); } }
6 获取事件源
//获取事件源 var getEvent1 = function(e){ e = e || window.event; var target = event.srcElement ? event.srcElement : event.target; return target } //方法2 function getEvent() { if (window.event) return window.event; var c = getEvent.caller; //找到 调用事件的最上层函数 arguments的第一个参数是事件源 while (c.caller) c = c.caller; return c.arguments[0]; }
调用例子:
<button id="btn">单击事件1</button> <button id="btn2">单击事件2</button> var btn = document.getElementById("btn"); var btn2 = document.getElementById("btn2"); addEvent(btn,'click',function( e ){ alert( getEvent() ); }); btn2.onclick=function(){ alert( getEvent() ); } /* removeEvent( btn, 'click',function(){ alert('移除') }); loadEvent(function(){ alert('loadEvent执行 ' ); }); */
相关推荐
在每个对象上,这个事件处理函数只会被执行一次。其他规则与bind()函数相同。这个事件处理函数会接收到一个事件对象,可以通过它来阻止(浏览器)默认的行为。如果既想取消默认的行为,又想阻止事件起泡,这个事件...
Delphi 动态绑定事件 指定事件处理函数过程 绑事事件自定义函数过程 测试完全可用,含源码文本.
NULL 博文链接:https://yxc-gdut.iteye.com/blog/1814757
vue ready事件处理函数使用方法
事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数。 事件对象可以携带额外信息,如 id, dataset, touches。 在组件中绑定一个事件处理函数。 如bindtap,当用户点击该组件的时候会在...
修改按键的事件处理函数,重新定义按键的事件消息。不触发信号与槽
vb串口通讯源码VB中串口事件处理函数的示例本资源系百度网盘分享地址
为了让函数只在页面加载完毕后才得到执行,我们会把函数绑定到onload事件上: [removed] = userFunction ...由此可得:每个事件处理函数只能绑定一条指令。 但我们可以这样做: [removed] = function(){ firstFun
可以使用switch功能,使多个控件的事件共享同一个事件处理方法。简化代码编写
目录(一)定义(二)HTML事件处理函数① 特点② 缺点(三)DOM0级事件处理函数① 使用② 删除③ 缺点(四)DOM2级事件处理函数① 使用② 删除③ 注意 (一)定义 事件就是用户或者浏览器自身执行的某种行为,例如...
DOM 0级事件处理一般是直接把一个函数分配给一个事件处理程序,既可以在元素中直接分配一个事件处理程序,如方式一所示;也可以在脚本中把函数分配给事件处理程序,如方式二所示。 <!--方式一--> <div ...
js代码-this的指向(模拟7):DOM事件处理函数的形式
触发事件之后就需要有事件处理函数去处理,例如我们可以定义当点击一个按钮之后,将一个div的背景设置为绿色,那么就先看一下如何实现此效果,代码实例如下: <html> <head> <meta charset=" utf-8...
众所周知,世界上97%的台式机上都安装有Flash Player,利用包含Flash创作工具、渲染引擎和已建立的超过200万的设计者和开发者群体的Flash平台生态系统,我们可以制作出各式各样的Flash动画。Adobe推出了flash最新...
在一个元素的属性中绑定事件,实际上就创建了一个内联事件处理函数(如…),内联事件处理函数有其特殊的作用域链,并且各浏览器的实现细节也有差异。 造成的影响 如果在元素的内联事件处理函数中使用的变量或调用的...
我当时的处理方法是在添加的时候手工绑定事件处理函数。不过新版的jquery已经添加了这个功能。我们已经不需要为此烦恼了。 参考:http://api.jquery.com/live/ 以前我们定义事件,比如为元素定义单击事件是这样写的...
bind()功能是为每个选择元素的事件绑定处理函数,感兴趣的你可以了解下它的语法bind(type, [data], fn),参数data是作为event.data属性值传递对象的额外数据对象,好好学习希望本可以帮助到你
EventUtil 跨浏览器事件处理函数
详细的解析了zstack里面关于事件处理的流程中涉及的函数和调用流程
众所周知,世界上97%的台式机上都安装有Flash Player,利用包含Flash创作工具、渲染引擎和已建立的超过200万的设计者和开发者群体的Flash平台生态系统,我们可以制作出各式各样的Flash动画。Adobe推出了flash最新...