Options de sélection de boucle jQuery

Ce guide jQuery concise montre comment manipuler efficacement les options de sélection de sélection (déroutes). Apprenez à récupérer les valeurs et le texte des options, ce qui facilite la manipulation des formulaires.

Exemple 1: Accès à toutes les options

Cet extrait ittente via chaque option dans un élément de sélection avec l'ID "SELECT", affichant son texte et sa valeur en utilisant alert().

$('#select > option').each(function() {
    alert($(this).text() + ' ' + $(this).val());
});

Exemple 2: Accédant uniquement à l'option sélectionnée

Cet exemple se concentre sur l'option actuellement sélectionnée, diffusant son texte et sa valeur.

$('#select > option:selected').each(function() {
    alert($(this).text() + ' ' + $(this).val());
});

Exemple 3: Récupération des données de sélection en tant que tableau

Cette fonction prend un nom de classe en entrée et renvoie un tableau d'objets, chacun contenant le texte et la valeur des options sélectionnées dans des éléments correspondant à cette classe.

function getSelects(klass) {
    var selected = [];
    $('select.' + klass).children('option:selected').each( function() {
         var $this = $(this);
         selected.push( { text: $this.text(), value: $this.val() } );
    });
    return selected;
}

Questions fréquemment posées (FAQ)

Cette section fournit des réponses aux questions courantes sur l'utilisation de jQuery avec des options sélectionnées.

Q1: Comment parcourir les options de sélection?

Utilisez la méthode de jQuery .each() pour itérer:

$('select option').each(function() {
  var optionValue = $(this).val();
  var optionText = $(this).text();
  // Your code here
});

Q2: Comment sélectionner une option spécifique?

Utilisez le sélecteur :selected:

var selectedOption = $('select option:selected').val();

Q3: Comment modifier l'option sélectionnée?

Utilisez la méthode .val():

$('select').val('Option2');

Q4: Comment ajouter une option?

Utilisez la méthode .append():

$('select').append('<option value="newOption">New Option</option>');

Q5: Comment supprimer une option?

Utilisez la méthode .remove():

$('select option[value="Option2"]').remove();

Q6: Comment désactiver / activer une option?

utiliser .attr() et .removeAttr():

$('select option[value="Option2"]').attr('disabled', 'disabled'); // Disable
$('select option[value="Option2"]').removeAttr('disabled'); // Enable

Q7: Comment obtenir le nombre d'options?

Utilisez la propriété .length:

var numberOfOptions = $('select option').length;

Q8: Comment effacer toutes les options?

Utilisez la méthode .empty():

$('select').empty();

Q9: Comment vérifier si une liste déroulante est vide?

if ($('select').children().length === 0) {
  // Dropdown is empty
}

Cette réponse révisée fournit une explication plus concise et organisée, tout en conservant les informations et l'image essentielles.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!