Comment déterminer si un contrôle est disponible dans jquery

jQuery est une bibliothèque JavaScript très populaire qui facilite extrêmement la mise en œuvre de l'interactivité dans les pages Web. Au cours du processus de développement, nous devons parfois déterminer si un contrôle peut être utilisé pour l'opération suivante, ce qui peut améliorer la convivialité, la lisibilité et la maintenabilité du code. Par conséquent, dans cet article, l'auteur expliquera comment déterminer si un contrôle est disponible dans jQuery.

1. L'état du contrôle

Avant de commencer, nous devons comprendre l'état du contrôle. Qu'il s'agisse d'une zone de texte, d'une zone déroulante ou d'une case à cocher, leurs états incluent généralement les trois états suivants :

1. État disponible (activé) : Le contrôle peut être actionné, et l'utilisateur peut saisir, sélectionner, cliquer , etc. dessus.
2. État désactivé (désactivé) : le contrôle ne peut pas être utilisé et l'utilisateur ne peut effectuer aucune opération dessus.
3. État en lecture seule (lecture seule) : le contrôle ne peut pas être modifié, mais des opérations telles que la sélection et le clic peuvent être effectuées.

Grâce à la description ci-dessus, nous pouvons voir que le statut en lecture seule et le statut disponible sont différents. En lecture seule, le contrôle peut être utilisé, mais l'utilisateur ne peut pas le modifier et ne peut effectuer que des opérations telles que la sélection ou le clic. Pour déterminer si un contrôle est en lecture seule, nous pouvons déterminer si la propriété en lecture seule du contrôle est vraie. Les états disponibles et désactivés des contrôles sont relativement similaires. Pour éviter toute confusion, nous appelons l'état disponible du contrôle « activé » et l'état désactivé du contrôle « désactivé ».

2. Méthode Attr

Dans jQuery, nous pouvons utiliser la méthode attr() pour obtenir ou définir les attributs d'un élément. La méthode attr() peut obtenir la valeur d'attribut d'un ou plusieurs éléments correspondants. Si l'attribut n'existe pas, il renvoie undéfini.

Par conséquent, nous pouvons utiliser la méthode attr() pour déterminer si un contrôle est disponible.

Comme le montre l'exemple ci-dessous :

<input type="text" id="text1" disabled="disabled" value="disabled">
<input type="text" id="text2" value="enabled">

En HTML, nous déclarons deux zones de texte, nommées text1 et text2. text1 est défini sur l'état désactivé et text2 est défini sur l'état activé. Ensuite, dans jQuery, nous pouvons utiliser le code suivant pour déterminer si ces deux contrôles sont disponibles :

if($('#text1').attr('disabled')) {
    alert('text1 is disabled.');
} else {
    alert('text1 is enabled.');
}

if($('#text2').attr('disabled')) {
    alert('text2 is disabled.');
} else {
    alert('text2 is enabled.');
}

Après avoir exécuté le code, nous constaterons que la première zone de texte détermine si elle est désactivée en déterminant que son attribut désactivé est vrai. La deuxième zone de texte n'a pas d'attribut désactivé, elle renvoie donc undéfini. En fonction de ce résultat, vous pouvez déterminer si la zone de texte est activée.

3. Méthode Prop

Après la version 1.6 de jQuery, jQuery a introduit la méthode prop(). Par rapport à la méthode attr(), la méthode prop() peut obtenir ou définir la valeur d'attribut de l'élément, mais uniquement pour l'attribut DOM de l'élément.

L'activation ou la désactivation d'un contrôle est un état de l'attribut DOM, nous pouvons donc déterminer l'état du contrôle via la méthode prop().

Comme le montre l'exemple suivant :

<input type="text" id="text1" disabled="disabled" value="disabled">
<input type="text" id="text2" value="enabled">

Vous pouvez utiliser le code suivant pour déterminer si les deux zones de texte sont activées :

if($('#text1').prop('disabled')) {
    alert('text1 is disabled.');
} else {
    alert('text1 is enabled.');
}

if($('#text2').prop('disabled')) {
    alert('text2 is disabled.');
} else {
    alert('text2 is enabled.');
}

Dans le code ci-dessus, si un contrôle est activé, la méthode prop() renvoie false, Si elle est désactivée, la méthode prop() renvoie true. Dans le développement réel, nous pouvons utiliser la méthode prop() pour déterminer plus facilement l'état du contrôle.

4. Résumé

Pour déterminer si un contrôle est disponible dans jQuery, nous pouvons utiliser la méthode attr() ou la méthode prop(). La méthode attr() détermine si le contrôle est disponible en obtenant la valeur d'attribut de l'élément, tandis que la méthode prop() peut renvoyer l'attribut DOM de l'élément et également déterminer si le contrôle est disponible. Grâce à la méthode présentée dans cet article, l’état d’un contrôle peut être facilement déterminé. Dans le développement réel, nous pouvons utiliser ces méthodes de manière flexible en fonction de besoins spécifiques.

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!