Option de liste jQuery-Select hover

Je souhaite alerter une option lorsque le curseur de la souris est dessus. J'utilise ce code:Option de liste jQuery-Select hover

$("select > option").hover(function() 
    { 
     alert($(this).attr("id")); 
    });

Malheureusement, cela ne fonctionne ni dans IE ni dans FF.

Quelqu'un peut-il me donner un indice s'il vous plaît?

Source

2012-02-04 enne87

vérifier les liens ci-dessous, des informations utiles http://stackoverflow.com/questions/2064011/select-option-hover-is-not-working-in-ie – kobe

un de plus http://stackoverflow.com/questions/4599975/html-select-box-options-on-hover – kobe

Vous pouvez essayer ceci.

$("select").hover(function (e) 
{ 
    var $target = $(e.target); 
    if($target.is('option')){ 
     alert($target.attr("id"));//Will alert id if it has id attribute 
     alert($target.text());//Will alert the text of the option 
     alert($target.val());//Will alert the value of the option 
    } 
});

Source

2012-02-04 20:44:43 ShankarSangoli

La raison en est que Chrome et IE ne vous permettent pas de capturer les événements directement sur les éléments d'option, mais vous permettent de capturer des événements sur des éléments sélectionnés. –

C'est très bien, merci Shankar :) – enne87

Je suis aux prises avec cela pour IE 8; Je ne vois pas les événements mouseover ou hoever des options, juste le select. Semble fonctionner dans Chrome et FF, mais pas dans IE. JQuery ("#" + id) .closest (". T-palette"). Find ("select"). Hover (fonction (événement) { T5.console.debug ("hover" + this.id Var; target = jQuery (event.target); if ($ target.is ("option")) { T5.console.debug ("option =" + $ target.text()); this .title = $ target.text(); } }); –

Si vous faites une boîte de sélection type "listbox" en ajoutant une "size = x" attribut comme ceci:

<select size="3"> 
    <option>...</option> 
    <option>...</option> 
</select>

L'événement hover travaillera sur les éléments option:

$('option').hover(function(){ 
    //code here 
});

Source

2012-12-30 18:40:09

Ne fonctionne pas mon pote .. IE, safari et chrome .. :( –

Testé de travail en safari et chrome - n'a pas testé IE - http: // jsfiddle.net/TJ6Fz/ –

grand maintenant retirer la taille et le tester à nouveau sur chrome @A_funs –

Voici une solution (je suppose que tout à fait convenable) -

Utilisez l'événement mouseover pour définir la taille de la zone de sélection égale au nombre. de ses enfants
Utilisez l'événement mouseenter pour obtenir les options. mouseenter travaux sur les options parfaitement quand size attribut est là (nous savons tous que maintenant)
Utilisez événement mouseout pour définir la taille de la boîte de sélection Retour à 1, pour obtenir notre boîte de sélection normale Retour :)

Source

2015-07-24 11:43:42

Option de liste jQuery-Select hover

Répondre

Questions connexes