Firefox 24.0 onclick没有正确触发目标

最近我一直在使用Firefox的一些主要问题。我的代码在Chrome中运行平稳，但Firefox似乎在查找我点击的内容时遇到了一些麻烦。你们有没有听说过这个？我基本上在div中有一堆SVG。 div有一个onclick事件来调用一个函数，它会触发，但是在错误的div上。所以我点击右侧的div，左侧的div接收点击。Firefox 24.0 onclick没有正确触发目标

这里是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>

你会看到什么我谈论当您单击SVG的标有“54”的一员，并触发对SVG为“57”。如果点击包含“54”的p标签，它也会启动。所以我猜这与SVG有关。

任何想法？（我也知道一切都没有对齐，我为此道歉，我只是重写了它是如何创建路径标记的，所以在放置它们时我不需要担心div旋转，现在一切都放错了位置）。

来源

2013-09-24 SalmonMode

添加

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

这些线中的每一个

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

之后，这似乎解决它。目前，您正在依靠webkit bug来使代码正常工作。

来源

2013-09-24 14:15:26

多么奇怪......我只是觉得SVG自动将这些作为默认设置，看起来就像它在Chrome中似乎起作用一样。非常感谢！ – SalmonMode

你并不孤单，但[SVG规范说不同]（http://www.w3.org/TR/SVG/coords.html#ViewportSpace）。请注意，所有的要点都是正确的，所以这意味着未设置宽度不会达到您认为应该达到的水平。 –

Firefox 24.0 onclick没有正确触发目标

回答

相关问题