1 
<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/。しかし、私はイベントがすでにHTMLで書かれている多くのdivを持っています<div></div>

たとえば、次のような 2 つの div があります ( http://jsfiddle.net/z8KuE/8/ )。代わりに 200 の div があり、イベントの種類がさらに多いと想像してください。最も実用的な方法でjqueryを使用してChromeで動作するようにするには、これをどのように処理できますか? (間違いなく、200 div からコンテンツを消去したり、200 行以上の jquery を書いたりすることはありません)

4

3 に答える 3

1

ワーキングデモ

jqueryでこれを行うことができます

コード

$('div').mouseenter(function () {
    $(this).css('background', '#aaaaaa');
});
$('div').mouseleave(function () {
    $(this).css('background','#222222');
});
于 2013-09-24T15:29:57.570 に答える
0

これを試しましたか？

<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/

于 2013-09-24T15:08:19.877 に答える