Compter le nombre de balises d'option dans une balise de sélection en jQuery

Question

Comment puis-je compter le nombre de <option> dans un <select> élément du DOM en utilisant jQuery ?

<select data-attr="dropdown" id="input1">
  <option value="Male" id="Male">Male</option>
  <option value="Female" id="Female">Female</option>
</select>

Je veux trouver le nombre de <option> dans les <select> DOM, car je veux ainsi ouvrir le panneau de configuration avec ce nombre de champs de saisie et la valeur de l'option correspondante de la liste déroulante et la modifier à nouveau dans le panneau de prévisualisation.

La boîte déroulante ci-dessus se trouve dans mon panneau de prévisualisation qui est généré par jQuery.

Answer 1

$('#input1 option').length;

Cela produira 2 .

Answer 2

La solution du W3C :

var len = document.getElementById("input1").length;

Answer 3

Votre question est un peu confuse, mais en supposant que vous voulez afficher le nombre d'options dans un panneau :

<div id="preview"></div>

y

$(function() {
  $("#preview").text($("#input1 option").length + " items");
});

Je ne suis pas sûr de comprendre le reste de votre question.

Answer 4

Dans une boîte d'option à sélection multiple, vous pouvez utiliser la fonction $('#input1 :selected').length; pour obtenir le nombre d'options sélectionnées. Cela peut être utile pour désactiver des boutons si un certain nombre minimum d'options n'est pas atteint.

function refreshButtons () {
    if ($('#input :selected').length == 0)
    {
        $('#submit').attr ('disabled', 'disabled');
    }
    else
    {
        $('#submit').removeAttr ('disabled');
    }
}

Answer 5

Ok, j'ai eu quelques problèmes parce que j'étais dans un

$('.my-dropdown').live('click', function(){  
});

J'avais des multiples dans ma page, c'est pourquoi j'ai utilisé une classe.

Ma liste déroulante était remplie automatiquement par une requête ajax lorsque je cliquais dessus, donc je n'avais que l'élément $(this)

donc...

Je devais le faire :

$('.my-dropdown').live('click', function(){
  total_tems = $(this).find('option').length;
});