Maison > interface Web > js tutoriel > Comment obtenir l'attribut « data-id » d'un élément cliqué à l'aide de jQuery ?

Comment obtenir l'attribut « data-id » d'un élément cliqué à l'aide de jQuery ?

Patricia Arquette
Libérer: 2024-12-09 17:34:10
original
357 Les gens l'ont consulté

How Do I Get the `data-id` Attribute of a Clicked Element using jQuery?

Obtenir l'attribut Data-ID pour les événements de clic jQuery

Lorsque vous travaillez avec le plugin jQuery Quicksand, il est nécessaire de récupérer l'identifiant de données attribut d'un élément cliqué à transmettre à un webservice. Cet attribut est crucial pour identifier l'élément spécifique.

Pour obtenir l'attribut data-id à l'aide de la méthode .on() de jQuery, utilisez la syntaxe suivante :

$(this).attr("data-id");
Copier après la connexion

Cette commande récupère la valeur associé à l'attribut data-id de l'élément qui a déclenché l'événement de clic.

Dans l'exemple fourni code :

$("#list li").on('click', function() {
  // Retrieve the data-id value
  let dataId = $(this).attr("data-id");
});
Copier après la connexion

Ici, dataId contiendra la valeur de l'attribut data-id de l'élément de liste cliqué (

  • ).

    Si vous utilisez jQuery 1.4. 3 ou version ultérieure, vous pouvez également utiliser la méthode .data() :

    $(this).data("id");
    Copier après la connexion

    Cette méthode renverra la valeur de l'attribut data-id sous la forme une valeur numérique s'il s'agit d'un entier.

    N'oubliez pas que le nom de l'attribut dans data- doit être en minuscules. Par exemple, data-id est valide, tandis que data-idNum n'est pas valide.

    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!

  • source:php.cn
    Déclaration de ce site Web
    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
    Derniers articles par auteur
    Tutoriels populaires
    Plus>
    Derniers téléchargements
    Plus>
    effets Web
    Code source du site Web
    Matériel du site Web
    Modèle frontal