4

抱歉，这似乎很讨人喜欢......这应该就是为什么 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 上总是以未定义的形式发出警报，并且像魅力一样在 Chrome 上工作。我可以在 Firefox 上抓取事件，但“x”总是未定义。

在 DOM 描述的 firefox 中，支持 Event 和 SVG。为了向后兼容，甚至使用“target”和“srcElement”属性定义了事件。

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

4

2 回答 2

5

在 d'alar'cop 回复后，我查看了代码，发现在 firefox 中有效的参数不是“event”或“Event”而是“evt”...... Firebug 中的控制台显示了这一点：

    function onclick(evt) { xpto(event) }

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

于 2013-04-07T14:31:00.933 回答
4

很多时候我看到在 HTML 代码中内联的事件处理程序，而不是依赖于更强大的事件侦听器。

而不是使用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 测试过）。

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

于 2013-04-07T03:07:16.270 回答