绑定事件

  1. var addEvent = function( obj, type, fn ) {
  2. if (obj.addEventListener)
  3. obj.addEventListener( type, fn, false );
  4. else if (obj.attachEvent) {
  5. obj["e"+type+fn] = fn;
  6. obj.attachEvent( "on"+type, function() {
  7. obj["e"+type+fn]();
  8. } );
  9. }
  10. };

另一个实现:

  1. var addEvent = (function () {
  2. if (document.addEventListener) {
  3. return function (el, type, fn) {
  4. el.addEventListener(type, fn, false);
  5. };
  6. } else {
  7. return function (el, type, fn) {
  8. el.attachEvent('on' + type, function () {
  9. return fn.call(el, window.event);
  10. });
  11. }
  12. }
  13. })();

绑定onpropertychange事件

onpropertychange是微软制造的一个事件,它在一个元素的属性发生变化的时候触发,常见的有文本的长度改变,样长改变等,FF大致和它相似的属性为oninput事件,不过它只针对textfield与textarea的value属性。safari,firefox,chrome与opera都支持此属性。

  1. var addPropertyChangeEvent = function (obj,fn) {
  2. if(window.ActiveXObject){
  3. obj.onpropertychange = fn;
  4. }else{
  5. obj.addEventListener("input",fn,false);
  6. }
  7. }

移除事件

  1. var removeEvent = function( obj, type, fn ) {
  2. if (obj.removeEventListener)
  3. obj.removeEventListener( type, fn, false );
  4. else if (obj.detachEvent) {
  5. obj.detachEvent( "on"+type, obj["e"+type+fn] );
  6. obj["e"+type+fn] = null;
  7. }
  8. };

加载事件 (如果把该函数调用放到window.onoad中,就没有效果了)

  1. var loadEvent = function(fn) {
  2. var oldonload = window.onload;
  3. if (typeof window.onload != 'function') {
  4. window.onload = fn;
  5. }else {
  6. window.onload = function() {
  7. oldonload();
  8. fn();
  9. }
  10. }
  11. }

阻止默认事件

  1. var stopEvent = function(e){
  2. e = e || window.event;
  3. if(e.preventDefault) {
  4. e.preventDefault();
  5. e.stopPropagation();
  6. }else{
  7. e.returnValue = false;
  8. e.cancelBubble = true;
  9. }
  10. },
  1. <form action="">
  2. <input type="text" value="请输入您的手机号">
  3. <input type="submit" id="sub" value="提交">
  4. </form>
  5. var sub = document.getElementById('sub');
  6. sub.onclick = function(){
  7. stopEvent();
  8. }

如果仅仅是阻止事件冒泡

  1. var stopPropagation = function(e) {
  2. e = e || window.event;
  3. if (!+"\v1") {
  4. e.cancelBubble = true;
  5. } else {
  6. e.stopPropagation();
  7. }
  8. }

取得事件源对象

  1. var getEvent = function(e){
  2. e = e || window.event;
  3. return event.target || event.srcElement
  4. }
  1. function getEvent() {
  2. if (window.event) return window.event;
  3. var c = getEvent.caller;
  4. while (c.caller) c = c.caller;
  5. return c.arguments[0];
  6. }
  1. var getEvent = function(e) {
  2. var e = e || window.event;
  3. if (!e) {
  4. var c = this.getEvent.caller;
  5. while (c) {
  6. e = c.arguments[0];
  7. if (e && (Event == e.constructor || MouseEvent == e.constructor)) {
  8. break;
  9. }
  10. c = c.caller;
  11. }
  12. }
  13. var target = e.srcElement ? e.srcElement : e.target,
  14. currentN = target.nodeName.toLowerCase(),
  15. parentN = target.parentNode.nodeName.toLowerCase(),
  16. grandN = target.parentNode.parentNode.nodeName.toLowerCase();
  17. return [e,target,currentN,parentN,grandN];
  18. }

javascript --- 兼容的那些事的更多相关文章

  1. 细说JavaScript单线程的一些事

    标签: JavaScript 单线程 首发地址:码农网<细说JavaScript单线程的一些事> 最近被同学问道 JavaScript 单线程的一些事,我竟回答不上.好吧,感觉自己的 Ja ...

  2. 关于javascript removeChild的那些事

    关于javascript removeChild的那些事 今天给removeChild搞死了,弄了几个小时,上代码 <ul id="myList"> <li> ...

  3. JavaScript 兼容各大浏览器阻止冒泡事件

    JavaScript 兼容各大浏览器阻止冒泡事件 function stopEvent(event) { //阻止冒泡事件 //取消事件冒泡 var e = arguments.callee.call ...

  4. 关于JavaScript继承的那些事

    在JavaScript中,对象的创建可以脱离类型(class free),通过字面量的方式可以很方便的创建出自定义对象. 另外,JavaScript中拥有原型这个强大的概念,当对象进行属性查找的时候, ...

  5. Javascript兼容和CSS兼容总结

    javascript部分 1. document.form.item 问题问题:代码中存在 document.formName.item(“itemName”) 这样的语句,不能在FF下运行解决方法: ...

  6. JavaScript 兼容处理IE67之 !"a"[0]

    IE67对字符串进行取值需要使用charAt()方法,不能直接通过数组方式的坐标访问: <!DOCTYPE html> <html> <head> <meta ...

  7. JavaScript 兼容 Array.prototype.slice.call

    IE9之前的IE版本的HTMLCollection以及NodeList不是Object的子类. 在通过Array.prototype.slice.call进行数组化的时候,IE9之前的IE版本会抛出异 ...

  8. ie7下的javascript兼容

    <a href="javascript:;" onclick="functionone();"></a> <script> ...

  9. Front End中Javascript兼容问题收集(转)

    1 select标签,就有诸多不兼容: A. cloneNode方法,对于非IE浏览器没有问题,对于IE浏览器, 遇到的问题包括:     1)option selected的会clone不过去,然后 ...

随机推荐

  1. github FATAL:unable to access 'https://github.com/...: Failed to connect to github.com:443; No error

    今天整理github,初次使用,很多都不懂,所以遇到了克隆失败的问题,研究了大半天,后来..... 打开Git Bash,克隆已有工程到本地: $ git clone https://github.c ...

  2. HDU 5489 Removed Interval DP 树状数组

    题意: 给一个长度为\(N\)的序列,要删除一段长为\(L\)的连续子序列,问所能得到的最长的\(LIS\)的长度. 分析: 设\(f(i)\)表示以\(a_i\)结尾的\(LIS\)的长度,设\(g ...

  3. Python学习-day10 进程

    学习完线程,学习进程 进程和线程的语法有很多一样的地方,不过在操作系统中的差别确实很大. 模块是threading 和 multiprocessing 多进程multiprocessing multi ...

  4. PHP 教父鸟哥 Yar 的原理分析

    模块越来越多,业务越来越复杂,RPC 就上场了,在 PHP 的世界里,鸟哥的作品一直备受广大网友的青睐.下面一起学习下鸟哥的 PRC 框架 Yar . 揭开 Yar 神秘面纱 RPC 采用客户端/服务 ...

  5. IDE介绍以及Eclipse的简单使用

    一.IDE介绍 ①   什么是IDE? 1.  IDE全称是”Integrated Development Environment”,中文称为“集成开发环境”; 2.是用于提供程序开发环境的应用程序, ...

  6. Git使用规范流程(转载)

    作者: 阮一峰 日期: 2015年8月 5日 团队开发中,遵循一个合理.清晰的Git使用流程,是非常重要的. 否则,每个人都提交一堆杂乱无章的commit,项目很快就会变得难以协调和维护. 下面是Th ...

  7. 设计模式(二 & 三)工厂模式:2-工厂方法模式

    模拟场景: 沿用 设计模式(二)工厂模式:1-简单工厂模式 中关于运算器 Operation 的例子. 思想: 针对在 Easy Factory 中提出的,破坏“开-闭原则”的问题,Factory M ...

  8. Codeforces 899B Months and Years

    题目大意 给定 $n$($1\le n\le 24$)个正整数 $a_1,\dots, a_n$ 判断 $a_1$ 到 $a_n$ 是否可能为连续 $n$ 个月份的天数. 解法 由于 $n\le 24 ...

  9. 刷题总结——work(ssoj)

    题目: 题目背景 SOURCE:NOIP2015-SHY-5 题目描述 假设现在离 noip 还有 m 天,有 n 个人要去参加比赛.他们每个人都有一个预定的训练量 r[i] ,所以每一天他们都抓紧时 ...

  10. poj3728The merchant

    The merchant Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 4800   Accepted: 1666 Desc ...