为什么这个onMouseOut事件不会在Firefox中激活？

Question

我以前见过这个问题,到目前为止还没有找到具体的答案.我有一个onmouseout活动几乎可以在Firefox上运行.它甚至没有出现在Firebug中,这完全没有任何意义.

以下是令人讨厌的代码行:

<div id="MarketBox3" class="MarketBox" style="top: 205px;">
<div id="TimeBox3Cont" class="TimeBox"><h3 ifirefoxd="TimeBox3" style="color: white; text-     shadow: 0px 0px 5px #000; letter-spacing: 1px; font-size: 12px;"></h3></div>
<div id="TimeBar3" class="TimeBar" style="left: 300px; width: 300px;" onmouseover="CheckOpen(3)" onmouseout="document.getElementById('intext3').innerText = 'bla bla'">
<div id="MarketName3" class="MarketName">
<div id="inbox3" style="position: absolute; top: -2px; height: 30px; width: 300px;">
<h3 id="intext3" style="color: white; text-shadow: 0px 0px 2px #000; letter-spacing: 1px; font-size: 16px;">Frankfurt - Germany</h3>
</div>
</div>
</div>
</div>

谁能对正在发生的事情有所了解？除了Firefox之外,它在所有方面都能正常工作.

Answer 1

这很好用:

<div id="MarketBox3" class="MarketBox" style="top: 205px;">
<div id="TimeBox3Cont" class="TimeBox"><h3 id="TimeBox3" style="color: white; text-     shadow: 0px 0px 5px #000; letter-spacing: 1px; font-size: 12px;"></h3></div>
<div id="TimeBar3" class="TimeBar" style="left: 300px; width: 300px;" onmouseover="document.getElementById('intext3').innerText = '111'" onmouseout="document.getElementById('intext3').innerText = 'bla bla'">
<div id="MarketName3" class="MarketName">
<div id="inbox3" style="position: absolute; top: -2px; height: 30px; width: 300px;">
<h3 id="intext3" style="color: white; text-shadow: 0px 0px 2px #000; letter-spacing: 1px; font-size: 16px;">Frankfurt - Germany</h3>
</div>
</div>
</div>
</div>

JS Fiddle上的演示.

CheckOpen()函数可能有问题,

尝试

onmouseover="alert(1)"

onmouseout="alert(2)"

代替

onmouseover="CheckOpen(3)"

另一个建议

似乎Firefox对内部文本的处理方式与其他浏览器不同.

使用javascript库会清除此问题,因为它会自动处理浏览器行为的差异.

我尝试使用jQuery,它工作正常.

<div id="MarketBox3" class="MarketBox" style="top: 205px;">
<div id="TimeBox3Cont" class="TimeBox"><h3 id="TimeBox3" style="color: white; text-     shadow: 0px 0px 5px #000; letter-spacing: 1px; font-size: 12px;"></h3></div>
<div id="TimeBar3" class="TimeBar" style="left: 300px; width: 300px;" onmouseover="javasript:function f(){ $('#intext3').text('bla bla');} f(); " onmouseout="javasript:function g(){ $('#intext3').text('1111');} g(); ">
<div id="MarketName3" class="MarketName">
<div id="inbox3" style="position: absolute; top: -2px; height: 30px; width: 300px;">
<h3 id="intext3" style="color: white; text-shadow: 0px 0px 2px #000; letter-spacing: 1px; font-size: 16px;">Frankfurt - Germany</h3>
</div>
</div>
</div>
</div>

JS Fiddle上的演示.