Maison >interface Web >js tutoriel >Comment puis-je appliquer une fonction jQuery à plusieurs éléments avec le même ID ?

Comment puis-je appliquer une fonction jQuery à plusieurs éléments avec le même ID ?

Susan Sarandon
Susan Sarandonoriginal
2024-10-29 03:56:02542parcourir

How Can I Apply a jQuery Function to Multiple Elements with the Same ID?

Accès aux éléments avec le même identifiant à l'aide de jQuery

En HTML, chaque élément doit avoir un identifiant unique. Cependant, il peut y avoir des scénarios dans lesquels vous devez appliquer une fonction jQuery à plusieurs éléments portant le même ID. Dans cet article, nous explorerons comment gérer de telles situations.

Selon l'extrait de code fourni, la fonction jcarousel() de jQuery n'est appliquée qu'au premier élément portant l'ID « carrousel ». Si vous avez plusieurs éléments avec le même ID, jQuery sélectionnera uniquement la première occurrence, ignorant les autres.

Solution utilisant la classe commune

L'approche recommandée consiste à attribuer une classe commune aux éléments, au lieu d'utiliser le même ID pour plusieurs éléments. Cela garantira que jQuery pourra facilement identifier tous les éléments qui doivent être modifiés. Voici un exemple utilisant une classe commune appelée "carrousel" :

<code class="js">jQuery(document).ready(function() {
    jQuery('.carousel').jcarousel();
});</code>

Solution alternative utilisant le même ID

S'il n'est pas possible de modifier les attributs de l'ID, vous pouvez utilisez la solution de contournement suivante :

<code class="js">jQuery(document).ready(function() {
    jQuery('[id=carousel]').jcarousel();
});</code>

Cette approche utilise le sélecteur d'attribut de jQuery [attribute=value] pour sélectionner tous les éléments dont l'identifiant d'attribut est défini sur "carrousel". Notez qu'il n'est pas recommandé d'utiliser le même identifiant pour plusieurs éléments et doit être évité si possible.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn