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

Comment compter le nombre de <option>s dans un <select>élément 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>balises dans l' <select>élément DOM, car avec cela, je veux ouvrir le panneau des paramètres avec ce nombre de champs d'entrée avec la valeur d'option correspondante dans la liste déroulante et la modifier à nouveau dans l'aperçu panneau.

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

$('#input1 option').length;

Cela produira 2.

La solution W3C:

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

Vous pouvez utiliser l'une ou l'autre propriété de longueur et les lengthperformances sont meilleures size.

$('#input1 option').length;

OU vous pouvez utiliser la fonction de taille comme

$('#input1 option').size(); 

Démo

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

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

et

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

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

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

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

Ok, j'ai eu quelques problèmes parce que j'étais à l'intérieur d'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)

alors...

Je devais faire:

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

La meilleure forme est celle-ci

$('#example option').length

Une autre approche qui peut être utile.

$('#select-id').find('option').length