選択ドロップダウンメニューでマウスの下にどのようなオプションがあるのかを特定するにはどうすればよいですか？

jQueryを使用したドロップダウンメニューで以下の動作を実装する際に問題があります。私はそれを望むので、ユーザーがmousesoverオプションの1つ、divが強調表示されます。この効果は、およそ所望の効果を発揮選択ドロップダウンメニューでマウスの下にどのようなオプションがあるのかを特定するにはどうすればよいですか？

http://jsfiddle.net/RY5r4/

<html> 
<head> 
<script type="text/javascript"> 

function showSelectValue(e) { 
if (e.target.id!= 'select') { 
document.getElementById('test').innerHTML = e.target.value; 
} 
} 

function attachTest() { 
document.getElementById('select').addEventListener('mouseover',showSelectValue,false); 
} 

</script> 

</head> 

<body onload="attachTest()"> 

<div id="test">Something Here</div> 

<select id="select"> 
<option value="1">One</option> 
<option value="2">Two</option> 
<option value="3">Three</option> 
<option value="4">Four</option> 
</select> 

</body> 
</html>

：迅速なGoogle検索は、私がここのためのフィドルを作成しましたこれを行う「非jqueryの」方法を示しました。テキストは、ユーザーが選択したオプション（クリックする必要はありません）に基づいて変更されます。私は現在、私の選択にonMouseOverハンドラを実装しましたが、どのオプションが強調表示されているかを判断する際に問題があります。私はこれをどのように達成するのですか？

出典

2012-04-02 duffmandrinkduff

私はあなたが何を望んでいるのかわかりませんが、 'e.target.text'を使ってオプションのテキストを取得します。 http://jsfiddle.net/skram/RY5r4/2/またはhttp://jsfiddle.net/skram/RY5r4/5/（テキストとバリューの両方）。 –

それは誰にも使用されている場合、スクリプトはjsFiddleのスクリプト部分に移動しました：http://jsfiddle.net/RY5r4/4/ –

：

$('#select').mouseover(function(e) { 
    if (e.target.id != 'select') { 
    $('#test').text(e.target.value); 
    } 
});

http://jsfiddle.net/Guffa/RY5r4/7/

このselect要素は、実際にここのコースは唯一のブラウザで動作するかどうかドロップダウンリストとして表示されます。また、Internet Explorerはこれをサポートしていません。

出典

2012-04-02 20:26:47 Guffa

Firefox上でのみ動作するようですが、今までのところ最高の答えでした。私はIEについては本当に気にしませんが、クロームではうまくいかないようです。助言がありますか？ – duffmandrinkduff

@duffmandrinkduff：そうではないにしても、それがサポートされていなければ、それはまったく可能なのか疑問です。オプションのタグを実際のDOM要素に変えなければならないということは標準に何もないので、驚くことではありません。 – Guffa

私はこれを行う方法がないと確信しています。少なくともリモートでブラウザ間で互換性があることもありません。 Mouseover option of select for IEで述べたように、あなたはjQueryのUI Selectmenuを試してみてください：

のjQueryに翻訳

http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/

出典

2012-04-02 20:09:00

選択ドロップダウンメニューでマウスの下にどのようなオプションがあるのか​​を特定するにはどうすればよいですか？

答えて

関連する問題

選択ドロップダウンメニューでマウスの下にどのようなオプションがあるのかを特定するにはどうすればよいですか？