1

私は次の問題を抱えています:

次のような選択メニューがあります。

<select id="selectClass" name="bookClass" data-native-menu="false" data-mini="true">
    <option selected="selected" value="A">CLASS A</option>
    <option value="B">CLASS B</option>
    <option value="C">CLASS C</option>
    <option value="D">CLASS D</option>
</select>

そして、各オプション要素のmouseoverandイベントを処理したい (select の mouseover、mouseleave イベントを処理したくない)。どうやってやるの?mouseleave<select>

4

2 に答える 2

3

An<option>は、それ自体では目に見える要素ではありません。これは要素の単なるデータで<select>あり、ほとんどの場合、ネイティブの O/S コントロールでレンダリングされます。

私の知る限り、これは実行できません。少なくとも、クロスブラウザーの方法ではできません。Firefox で動作するようです。

編集実際には Webkit ブラウザーでも機能しますが、<select>要素にsize属性があり、複数<option>が表示される場合に限られます。

于 2012-09-04T12:44:51.327 に答える
1

あなたはそれを行うことができます -デモ

$("option").on("mouseover", function(e) {
    e.stopPropagation();

    $("p").text( $(this).val() );
});

更新:残念ながらFirefox でのみ動作します

于 2012-09-04T12:50:16.140 に答える