在IE8 +中使用JavaScript参考图像映射区域元素

Question

我正在尝试使用JavaScript来引用图像映射中的区域元素，但在IE8 +中它不起作用。

我的HTML：

<div class="container">
    <img src="image.png" usemap="#hotspots">
    <map name="#hotspots">
        <area id="seg-1" href="" shape="poly" coords="167,286,113,379,320,379,266,286,167,286"/>
        <area... />
        <area... />
        <area... />
        ...
    </map>
</div>

我的JavaScript：

document.getElementById("seg-1");

我分配了一个传统的事件处理程序，如下所示：

document.getElementById("seg-1").onmouseup = function() {alert("onmouseup called");};

这适用于：

• Safari 6（OS X）
• Chrome 26（OS X）
• Firefox 21（OS X）
• Chrome 27（XP）
• Chrome 27（W7）
• Chrome（W8）。

但不在：

• IE8（XP）
• IE9（W7）
• IE10（W8）
• Firefox 17（XP）
• Firefox 21（W7）
• Firefox 21（W8）。

当我跑步时：

console.log(document.getElementById("seg-1"));

我获取了上述浏览器的元素，但我在上述浏览器中获取了不起作用的页面的URL。

任何想法如何使我的工作？

PS：这是jsFiddle：http://jsfiddle.net/Stimpski/Y5jeJ/

Answer 1

尽管看起来很讨厌console.log()，document.getElementById("seg-1")引用了HTML元素，但只有area的{​​{1}}方法显示了网址。

这对某些浏览器不起作用的原因是toString()的名称。您不应在map的{​​{1}}属性中使用#。仅name的{​​{1}}属性需要map。