Question

很抱歉，这似乎是一个很棒的人群...这应该是为什么firefox没有改变他们的代码以完全符合像Chrome一样的Event对象。我完成了我的作业，在StackOverflow上尝试了几个解决方案，但似乎没有任何效果。我有这段代码：

function xpto(e) {
if( !e ) e = window.event;
  var x = e.target||e.srcElement;
alert(x);
    ........
}

正在拨打电话：

<svg id="graph-svg" onclick="xpto(event)" style="outline: none;" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

是的......这是我试图点击的svg元素。我没有提供完整的代码，因为它与问题无关。底线，

alert(x)

始终在Firefox上使用undefined进行警报，并且像Chrome一样在Chrome上工作。我可以在Firefox上抓住这个事件，但是＆＃34; x＆＃34;总是来不明确。

在Firefox描述的Firefox中，支持Event和SVG。事件甚至用＆＃34;目标＆＃34;定义。和＆＃34; srcElement＆＃34;向后兼容性的属性。

我在Ubuntu上使用Firefox 20 ...有人可以帮忙吗？

Answer 1

在来自d'alar'cop的回复之后，我去了代码，发现在firefox中运行的参数不是“event”或“Event”而是“evt”...... Firebug中的控制台显示了这样：

    function onclick(evt) { xpto(event) }

因此我意识到处理程序是用“event”而不是原始参数“evt”调用的。然后，当它被击倒到处理程序中时，“事件”变为“空”...未定义。

Answer 2

很多时候，我看到HTML代码内联了事件处理程序，而不是依赖更强大的event listeners。

而不是使用onclick为什么不将监听器附加到SVG元素？你可以试试这个：

var addListener = function (element, event, callback) {
    // We define a cross-browser function
    if (window.addEventListener) {
        // Mozilla/Webkit/Opera
        element.addEventListener(event, callback, false);
    } else {
        // IE
        element.attachEvent('on' + event, callback);
    }
};

// Then we attach the event listener to the SVG element
addListener(document.getElementById('graph-svg'), 'click', function (evt) {
    // Here you can manage the fired event
    alert(evt);
});

或者，使用jQuery：

$('#graph-svg').on('click', function(evt){
    alert(evt);
});

您可以使用此fiddle进行尝试（在Ubuntu 12.10上使用FF 20.0和Chrome 26进行测试）。

当然，内联处理程序并不总是邪恶的，但很多时候它们不是解决方案，恕我直言。

Firefox上的事件对象

2 个答案: