События работают в Firefox / Chrome, но не работают в IE - PullRequest
1 голос
/ 30 марта 2009

Я только что построил карту SVG Новой Зеландии для использования с превосходной библиотекой javascript Raphael , но, к сожалению, наткнулся на то, что я могу себе представить, это ошибка или синтаксическая вариация в интерпретаторе JavaScript 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>

Большое спасибо:)

Ответы [ 4 ]

3 голосов
/ 30 марта 2009

Исправление, по-видимому, использует событие 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 , мне было бы интересно услышать!

1 голос
/ 30 марта 2009

Вы пробовали прикреплять события?

if (rg[0].attachEvent)
    rg[0].attachEvent("onclick", function(){ /* IE */ });
else
    rg[0].addEventListener("click", function(){ /* other */ }, false);
0 голосов
/ 30 марта 2009

Как правило, абстракция, как jquery или прототип, - ваш лучший выбор. Они обрабатывают различия браузера для вас. Кроме того, вы можете подписаться на ваши события на более высоком уровне ... в браузере дешевле подписаться на перемещение / щелчок мыши и определить, на что вы остановились или нажали на всплывающее окно события, чем на многие объекты. 1001 *

Джоэл Поттер упомянул модель подписчика с использованием методов dom и IE, что является лучшей практикой, чем назначение метода.

0 голосов
/ 30 марта 2009

IE точно не известен своей корректной работой. Было бы полезно, если бы вы упомянули, какую версию IE вы используете.

...