Question

<div style="position: relative; left: 50px; top: 30px; width: 300px; height: 150px; background: #222222;" onmouseenter="this.style.background='#aaaaaa'" onmouseleave="this.style.background='#222222';"></div>

http://jsfiddle.net/z8KuE/1/

onmouseenter和onmouseleave事件在Firefox和Opera中正常工作，但显然在Chrome中根本不起作用......

在这个小提琴中，一个简单的基本div如何在Chrome中正常运行，但不改变内容（除了分配一个类）？

如果可能的话，理想的解决方案是以某种方式为Chrome用户注册onmouseenter和onmouseleave事件，而无需分配课程。

编辑我知道onmouseover和onmouseout，但它们是不可能的 - 出于某些实际原因，我需要为我的代码解决一些问题。

编辑2：现在我只有特定类的jquery - http://jsfiddle.net/z8KuE/6/。但我有很多div，它的事件已经用html编写，在<div></div>

内

例如，我有2个这样的div（http://jsfiddle.net/z8KuE/8/）。想象一下，有200个div而不是事件的多样性。如何以最实用的方式处理Chrome中的jquery？（绝对不会从200个div中删除内容并用200行或更多行编写jquery）

Answer 1

工作DEMO

您可以使用jquery

执行此操作

码

$('div').mouseenter(function () {
    $(this).css('background', '#aaaaaa');
});
$('div').mouseleave(function () {
    $(this).css('background','#222222');
});

Answer 2

你试过这个吗？

<div style="position: relative; left: 50px; top: 30px; width: 300px; height: 150px; background: #222222;" onmouseover="this.style.background='#aaaaaa'" onmouseout="this.style.background='#222222';"></div>

http://jsfiddle.net/z8KuE/2/

Answer 3

Chrome仅支持onmouseover和onmouseout

    <div style="position: relative; left: 50px; top: 30px; width: 300px; height: 150px; background: #222222;" 
onmouseenter="this.style.background='#aaaaaa'" 
onmouseleave="this.style.background='#222222';"
onmouseover="this.style.background='#aaaaaa'"
onmouseout="this.style.background='#222222'"

></div>

http://jsfiddle.net/z8KuE/1/

使onmouseenter和onmouseleave在chrome-html，javascript，jquery中工作

3 个答案:

工作DEMO

码