Question

我刚刚构建了一个新西兰的SVG地图，用于优秀的javascript库Raphael，但不幸的是偶然发现我只能想象的是IE的javascript解释器中的错误或语法变体。

在Firefox和其他浏览器中，onlick和onmouseover事件工作正常 - 但是它们不会在IE中激活（在IE 7中测试）。不幸的是，没有javascript错误可以帮助我调试这个，所以我只能假设IE以一些根本不同的方式处理这些事件。

<script type="text/javascript" charset="utf-8">
    window.onload = function() {
        var R = Raphael("paper", 450, 600);
        var attr = {
            fill: "#3f3f40",
            stroke: "#666",
            "stroke-width": 1,
            "stroke-linejoin": "round"
        };
        var nz = {};
        nz.northland = R.path(attr, "M 193.34222,3.7847503 C 194.65463");
                // SVG data stripped for sake of brevity
        var current = null;
        for (var region in nz) {
            nz[region].color = Raphael.getColor();
            (function(rg, region) {
                rg[0].style.cursor = "pointer";
                rg[0].onmouseover = function() {
                    current && nz[current].animate({ fill: "#3f3f40", stroke: "#666" }, 500) && (document.getElementById(current).style.display = "");
                    rg.animate({ fill: rg.color, stroke: "#ccc" }, 500);
                    rg.toFront();
                    R.safari();
                    document.getElementById(region).style.display = "block";
                    current = region;
                };
                rg[0].onclick = function() {
                    alert("IE never gets this far.");
                    //window.location.href = "my-page.aspx?District=" + region;
                };
                rg[0].onmouseout = function() {
                    rg.animate({ fill: "#3f3f40", stroke: "#666" }, 500);
                };
                if (region == "northland") {
                    rg[0].onmouseover();
                }
            })(nz[region], region);
        }
    };
</script>

非常感谢：）

Answer 1

修复似乎是使用onmousedown事件而不是onclick。

更改：

rg[0].onclick = function() {
alert("IE never gets this far, but Firefox is happy.");
};

到

rg[0].onmousedown = function() {
alert("This works in IE and Firefox.");
};

解决了这个问题。感谢大家的投入 - 最终到达那里。如果有人真的知道为什么IE不喜欢 onclick ，我会有兴趣听到！

Answer 2

您是否尝试过附加活动？

if (rg[0].attachEvent)
    rg[0].attachEvent("onclick", function(){ /* IE */ });
else
    rg[0].addEventListener("click", function(){ /* other */ }, false);

Answer 3

IE并不完全以正常工作而着称。如果您提到正在使用的IE版本，将会有所帮助。

Answer 4

通常，抽象框架，如jquery或原型是最好的选择。他们为您处理浏览器差异。此外，您可以在更高级别订阅您的活动...在浏览器中订阅鼠标移动/点击更便宜，并确定您已经结束，或点击事件气泡而不是许多对象。< / p>

Joel Potter使用dom和IE方法提到了订阅者模型，这比方法赋值更好。

事件在Firefox / Chrome中有效但在IE中失败

4 个答案: