【转】event对象、srcElement、offsetX 在 firefox中的解决方案

问题一：在IE中event作为window对象的一个属性可以直接使用，但是在Firefox中却使用了W3C的模型，它是通过传参的方法来传播事件的，也就是说你需要为你的函数提供一个事件响应的接口，也就是在执行引用了event这个属性的方法时候，这个方法要传一个参数进去。
解决方案：
第一种 显式传输event对象。
第二种 使用自定义的函数生成对象。
function getEvent() //同时兼容ie和ff的写法
{
if(document.all)   return window.event;  
func=getEvent.caller;      
while(func!=null){
var arg0=func.arguments[0];
if(arg0)
{
if((arg0.constructor==Event || arg0.constructor ==MouseEvent) || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))
{
return arg0;
}
}
func=func.caller;
}
return null;
}
这样，使用var evt = getEvent(); 就可以生成一个evt对象，替代之前使用的event即可。
问题二：
IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcElement属性.
event.srcElement从字面上可以看出来有以下关键字：事件,源     他的意思就是：当前事件的源，
我们可以调用他的各种属性 就像:document.getElementById("")这样的功能，
IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcElement属性.但他们的作用是相当的，即：
firefox 下的 event.target = IE 下的 event.srcElement

解决方法:
第一种 使用obj(obj = event.srcElement ? event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target.
第二种 elm = event.srcElement || event.target;
问题三 FF中没有event.offsetX
解决方案：判断offsetX属性是否为未定义（"undefine"），调用自定义函数getoffset
function (evt)
{
var target = evt.target;
if (target.offsetLeft == undefined)
{
    target = target.parentNode;
}
var pageCoord = (target);
var eventCoord =
{
    x: window.pageXOffset + evt.clientX,
    y: window.pageYOffset + evt.clientY
};
var offset =
{
    offsetX: eventCoord.x - pageCoord.x,
    offsetY: eventCoord.y - pageCoord.y
};
return offset;
}

function (element)
{
var coord = {x: 0, y: 0};
while (element)
{
    coord.x += element.offsetLeft;
    coord.y += element.offsetTop;
    element = element.offsetParent;
}
return coord;
}
程序内加上判断：

if (evt.offsetX == undefined)   //Firefox
{
var evtOffsets = getOffset(evt);
n_offsetX=evtOffsets.offsetX;
n_offsetY=evtOffsets.offsetY;
}
else
{
n_offsetX=evt.offsetX;
n_offsetY=evt.offsetY;
}
即可。
FF与IE还有很多不兼容的地方，最佳方案是使用第三方的JS库。
转自http://hi.baidu.com/%CB%AE%C9%BD%B7%E5/blog/item/1a0ed617fefeebf0f6039e85.html



这里也有第二种解决方式
一、在函数中传递event参数

    在函数中传递event参数，这样我们就可以兼容IE和FF的event的获取了，如下面的函数：

function _test(evt)
{
    var src = evt.srcElement || evt.target; // 获取触发事件的源对象
    alert(src.value); // 打印该对象的value属性
}

    那么我们在使用的时候就应该这样：

<input type='button' value='click me' onclick='_test(event)' />

二、在函数调用中不传递event对象

    虽然在函数中没有传递参数，这个在IE下没有任何影响，因为window.event是全局对象，在什么地方都可以直接调用的，而在FF下就不行了。所以我们这里要使用另外一种方式来获取了，如下：

function _test2()
{
    var evt = window.event || arguments.callee.caller.arguments[0]; // 获取event对象
    var src = evt.srcElement || evt.target; // 获取触发事件的源对象
    alert(src.value); // 打印该对象的value属性
}

    那么，我们在使用的时候就可以想普通的函数调用一样，直接输入函数名称即可，如下：

<input type='button' value='click me2' onclick='_test2()' />

    可见，相比两种方法，第二种方法更具有普遍和通用性，因为可以不用传递参数了，这样在使用的时候也更加的方便；第一种方式就更加直接明了，呵呵，至于具体怎么用，还得看个人的了~~