event对象

IE 中可以直接使用 event 对象,而 FF 中则不可以,解决方法之一如下:
var theEvent = window.event || arguments.callee.caller.arguments[0];

第二种是将 event 作为参数来传递:
function xxx(e){var theEvent = window.event || e;}

srcElement 和 target

在 IE 中 srcElement 表示产生事件的源,比如是哪个按钮触发的 onclick 事件,FF 中则是 target。

var theEvent = window.event || arguments.callee.caller.arguments[0];
var theObj=theEvent.target || theEvent.srcElement;

例子:

document.onclick = function(e){
           var theEvent = window.event || e;
           var theObj=theEvent.target || theEvent.srcElement;

function clickAction(){
       var theEvent = window.event || arguments.callee.caller.arguments[0];
       var theObj=theEvent.target || theEvent.srcElement;

// do something;
}

function clickAction(e){
       var theEvent = window.event || e;
       var theObj=theEvent.target || theEvent.srcElement;

// do something;
}

event.keyCode 和event.which

FF不支持window.event.keyCode,代替着是event.which

列子:

//在网页上面屏蔽tab键的代码
document.onkeydown = function (e){
            var theEvent = window.event || e;
            var code = theEvent.keyCode || theEvent.which;
            if(code == 9){
              return false;
            }
}

============

Query对DOM的事件触发具有冒泡特性。有时利用这一特性可以减少重复代码,但有时候我们又不希望事件冒泡。这个时候就要阻止 jQuery.Event冒泡。

jQuery.Event 的文档 中的开头得知,jQuery.Event对象是符合W3C标准的一个事件对象,同时jQuery.Event免去了检查兼容IE的步骤。

jQuery.Event提供了一个非常简单的方法来阻止事件冒泡:event.stopPropagation();

  1. $("p").click(function(event){
  2. event.stopPropagation(); // do something
  3. })
  1. <span style="font-size:18px;">$("p").click(function(event){
  2. event.stopPropagation(); // do something
  3. })</span>

但是这个方法对使用live 绑定的事件没有作用,需要一个更简单的方法阻止事件冒泡:return false;

  1. $("p").live("click", function(){
  2. $(this).after("Another paragraph!");
  3. return false;
  4. });
  1. <span style="font-size:18px;">$("p").live("click", function(){
  2. $(this).after("Another paragraph!");
  3. return false;
  4. });</span>

另外 JavaScript 阻止冒泡

 阻止冒泡事件的方法有两种,第一种是IE的方法,第二种是DOM方法,至于为什么要分为两种方法去讨论之,这里就不做讨论了,总之是浏览器一些蹩脚的问题,好了废话不说了,直接贴代码了:

  1. //阻止冒泡事件
  2. function stopBubble(e) {
  3. if (e && e.stopPropagation) {//非IE
  4. e.stopPropagation();
  5. }
  6. else {//IE
  7. window.event.cancelBubble = true;
  8. }
  9. }
  1. <span style="font-size:18px;">   //阻止冒泡事件
  2. function stopBubble(e) {
  3. if (e && e.stopPropagation) {//非IE
  4. e.stopPropagation();
  5. }
  6. else {//IE
  7. window.event.cancelBubble = true;
  8. }
  9. }</span>

举个例子:就是谷歌首页的更多选项吧,不知道的可以去看看http://www.google.com/ 。
这里要应用两个点击事件,一个是div.onclick,另一个就是document.onclick,那么问题就出现了,在调用 div.onclick的时候,由于冒泡事件的存在,会自动的调用document.onclick,由于冒泡的顺序是从里向外的

(div->body->document->html)所以div.onclick事件就会被覆盖掉,也就不会执行了,解决的方案其实也是很简单的哦,就是在执行div.onclick的时候阻止冒泡事件就好了,那怎么阻止呢,就调用上面的函数就ok了!哈哈! 
ps:在介绍一下阻止浏览器默认行为的方法,大同小异,这里就不再赘述了。

    1. function stopDefault(e) {
    2. //阻止默认浏览器动作(W3C)
    3. if (e && e.preventDefault)
    4. e.preventDefault();
    5. //IE中阻止函数器默认动作的方式
    6. else
    7. window.event.returnValue = false;
    8. return false;
    9. }

IE和FireFox中JS兼容之event .的更多相关文章

  1. [转]IE和FireFox中JS兼容之event .

    转载于:http://blog.csdn.net/jiachunfeng/article/details/6448186 http://justcoding.iteye.com/blog/587876 ...

  2. css padding在ie7、ie6、firefox中的兼容问题

    padding 简写属性在一个声明中设置所有内边距属性. 说明这个简写属性设置元素所有内边距的宽度,或者设置各边上内边距的宽度.行内非替换元素上设置的内边距不会影响行高计算:因此,如果一个元素既有内边 ...

  3. 原型扩展的方法解决IE和Firefox的Js兼容问题

    if(!document.all){//textContent->text    Element.prototype.__defineGetter__('text',function(){ret ...

  4. js事件源window.event.srcElement兼容性写法

    <html> <body> <p>一个好处就是 我想让body(或其他元素内)的某些对象响应事件 就不用挨个儿去写 只要在外层上写一个 然后检查event.srcE ...

  5. JS中的兼容问题总结

    今天总结总结在JS里面遇到的兼容性问题 1.获取滚动距离的兼容性问题: document.documentElement.scrollTop  ||  document.body.scrollTop ...

  6. JS网站当前日期在IE9、Chrome和FireFox中年份显示为113年的解决方法 getFullYear();

    JS网站当前日期在IE9.Chrome和FireFox中年份显示为113年的解决方法 getFullYear();

  7. [转]FireFox与IE 下js兼容触发click事件的代码

    本文转自:http://www.jb51.net/article/16549.htm FireFox与IE 下js兼容触发click事件 ,对于需要兼容这两者的朋友,就需要参考下下面的代码了<a ...

  8. JS中的offset scroll event client

    一.offset 一般用来检测盒子的偏移.位移,都是只读属性,不能赋值 offsetWidth和offsetHeight表示的是:调用者盒子的宽和高,包括盒子自身的padding和border off ...

  9. JS中浏览器兼容问题

    body的子节点IE 火狐 显示3个  其他显示7个 float浮动中的兼容 link 操作外联的兼容

随机推荐

  1. BZOJ 1042 硬币购物

    先不考虑限制,那么有dp[i]表示i元钱的方案数. 然后考虑限制,发现可以容斥. 其实整个题就是两个容斥原理.感觉出的蛮好的. #include<iostream> #include< ...

  2. PHP_ArrayList

      <?php //遍历数组的2种方式 $arr=array( "1"=>"hello", "2"=>"my&q ...

  3. Margaritas on the River Walk_背包

    Description One of the more popular activities in San Antonio is to enjoy margaritas in the park alo ...

  4. 负margin居中

    <!DOCTYPE html><html> <head> <title> new document </title> <meta na ...

  5. 【转发】构建高可伸缩性的WEB交互式系统(上)

    原文转自:http://kb.cnblogs.com/page/503460/ 可伸缩性是一种对软件系统处理能力的设计指标,高可伸缩性代表一种弹性,在系统扩展过程中,能够保证旺盛的生命力,通过很少的改 ...

  6. JavaScript string.format

    //string.format String.prototype.format=function(){ var e = this, f = arguments.length; if (f > 0 ...

  7. 解析nginx负载均衡

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://baidutech.blog.51cto.com/4114344/1033718 ...

  8. 即使连网了ping也会失败

    /*************************************************************************** * 即使连网了ping也会失败 * 说明: * ...

  9. fn

    var avalon = function (el) { return new avalon.init(el) } avalon.init = function (el) { this[0] = th ...

  10. subprocess module

    subprocess 主要用于执行外部命令和程序, 极大的增强了Python的功能. 比如你要用bowtie, 你可以在python中调用这个程序. 运行python时,我们都是在创建并运行一个进程, ...