Firefox图像按钮onmouseover事件不会触发

Question

快速提问。我用自己漂亮的PNG替换了我网站上的按钮。然后将图像包装在提交按钮标记中。容易腻到对吗？为清楚起见......

<button type='submit' style='border: 0; background: transparent;'>
    <[img tag here] />
</button>

然后为了使它们感觉互动，有一个辅助按钮，对于图像onmouseover事件，光照效果略有不同。一切都适用于chrome但不适用于firefox。为了记录，我有一些设置与一些锚标签，在Firefox中工作，所以它是特定的提交按钮。看起来firefox正在捕获按钮节点中的onmouseover事件，并且它没有到达图像标记。建议？

注意 onmouseover被编码到html标签本身。我真的不想将代码移动到一个单独的监听器（太多的按钮，这对我来说更干净）。

感谢您提前的时间！

修改 对不起 - 猜猜我可能也包括它，只是加入＆gt; _＆lt;'

<button type='submit' style="border: 0; background: transparent;">
   <img class='med_button' style='padding:0;margin:0 0 0 -8px;' src='<?php echo base_url().'assets/images/login_indent_green.png'; ?>' alt='login' onmouseover="src='<?php echo base_url().'assets/images/login_indent_green_hover.png'; ?>'" onmouseout="src='<?php echo base_url().'assets/images/login_indent_green.png'; ?>'" />
</button>

Answer 1

如果你做这样的事情会容易得多

<input type="image" class="someclass" />

然后在CSS背景图像中设置类“someclass”和：hover event。