Ajouter un atsortingbut sélectionné à une option dans le menu de sélection avec jQuery

Je crée un plug-in de menu de sélection pour remplacer les sélections laides par défaut et être cohérent sur différents systèmes d’exploitation.

Voici la démo (seulement firefox et webkit)
http://spacirdesigns.com/selectMenu/

Cela fonctionne déjà, mais je ne parviens pas à atsortingbuer l’atsortingbut “sélectionné” à l’option. Le code fonctionne avec n’importe quel autre atsortingbut mais je ne peux pas le faire fonctionner avec l’atsortingbut sélectionné.

Cela marche:

select.find('option') .removeAttr('whatever') .eq(index).attr('whatever', 'hello'); 

Cela ne veut pas:

 select.find('option') .removeAttr('selected') .eq(index).attr('selected', 'selected'); 

Et voici le code jusqu’à présent:

 (function($){ $.fn.selectMenu = function() { var select = this; select.hide(); var title = select.attr('title'); var arrow = 'img/arrow.png'; var items = ''; select .children('option') .each(function(){ var item = $(this).text(); if ($(this).val() != '') { $(this).attr('value', item); } items += '
  • ' + item + '
  • ' }); var menuHtml = '
      ' + '' + '
    • ' + title + '
    • ' + '
        ' + items + '
      ' + '
    '; select.after(menuHtml); var menu = $(this).next('ul'); var list = menu.find('ul'); menu .hover(function(){}, function(){ list.hide(); }) .children('li').hover(function(){ list.show(); }); menu.find('ul li').click(function(){ var index = $(this).index(); menu.children('li').text($(this).text()); select.find('option') .removeAttr('selected') .eq(index).attr('selected', 'selected'); list.hide(); }); }; })(jQuery);

    Découvrez cette réponse détaillée précédente sur SO :

    Si vous voulez vraiment conserver la sortie HTML avec l’atsortingbut selected, et que non seulement jQuery maintienne le bon atsortingbut selectedIndex sur l’élément select, vous pouvez pirater avec la fonction originale settAttr ():

     select[0].options[select[0].selectedIndex].setAtsortingbute('selected','selected'); 

    Mais dès que vous continuez à utiliser les méthodes jQuery pour val () ou ‘: selected’, vous ne devriez pas avoir de problème, vous pourriez avoir un problème seulement si vous analysiez le HTML pour trouver l’atsortingbut sélectionné, ce que vous ne devriez pas faire, jamais .

    A partir de jQuery 1.6 “Pour récupérer et modifier les propriétés DOM telles que l’état coché, sélectionné ou désactivé des éléments de formulaire, utilisez la méthode .prop ().”

     $("#someselect option[value=somevalue]").prop("selected", "selected") 

    Compte tenu de votre dernier commentaire, je suppose que votre problème est firebug, pas votre code. Pourquoi cela fonctionne-t-il avec d’autres atsortingbuts sauf “sélectionné”? La sélection d’une option dans la liste déroulante ne modifie pas l’atsortingbut sélectionné dans le DOM. Je vous assure qu’il n’y a rien de mal avec votre code.