0

我最近在使用 Firefox 时遇到了一些重大问题。我的代码在 Chrome 中运行流畅，但 Firefox 似乎无法确定我在点击什么。你们听说过这个吗？我基本上在 div 中有一堆 SVG。div 有一个 onclick 事件来调用一个函数，该函数会触发，但在错误的 div 上。所以我点击右侧的 div，左侧的 div 接收点击。

这是javascript

http://pastebin.com/wbYnqT4B

这是HTML

http://pastebin.com/aXMyYtS8

它生成这些元素并将它们定位在整个页面中，当单击时，应该会出现一个包含有关元素信息的框。但是其他元素似乎声称是事件目标，尽管我点击了数百像素之外的元素。

<div id="6-084" class="room" fullname="John Smith" phonenum="None" pcname="Unknown" wallplatenum="Unknown" onclick="displayInfo(event)" style="height: 72px; width: 96px; position: absolute; left: 753px; top: 236px; opacity: 1;">
    <svg id="6-084-svg" style="-webkit-backface-visibility: hidden;" class="room">
        <g id="6-084-svg-g">
            <path style="fill:none; stroke: black; stroke-width: 2;" d="M 95,1 L 95,51 Q 80,51 80,66 L 95,66 L 95,71 L 1,71 L 1,1 Z "></path>
        </g>
    </svg>
    <div id="6-084 divP" style="position: absolute; z-index: 2; top: 20.5px; left: 34px;">
        <p id="6-084 P" style="text-align:center;">Name</p>
    </div>
</div>

当您单击标有“54”的 SVG 并在 SVG 上触发“57”时，您会确切地看到我在说什么。如果您单击包含“54”的 p 标签，它也会触发。所以我猜这与SVG有关。

有任何想法吗？

（另外，我知道一切都是未对齐的，对此我深表歉意。我只是重写了它如何创建路径标签，所以在放置它们时我不需要担心 div 旋转，现在一切都放错了位置。）

4

1 回答 1

1

添加

svg.setAttribute("width", "100%");
svg.setAttribute("height", "100%");

在每一行之后

var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");

这似乎可以解决它。目前，您依靠 webkit 错误来运行代码。

于 2013-09-24T14:15:26.790 回答