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 ?

Dec 09, 2024 pm 05:34 PM

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!

  • 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

    Outils d'IA chauds

    Undresser.AI Undress

    Undresser.AI Undress

    Application basée sur l'IA pour créer des photos de nu réalistes

    AI Clothes Remover

    AI Clothes Remover

    Outil d'IA en ligne pour supprimer les vêtements des photos.

    Undress AI Tool

    Undress AI Tool

    Images de déshabillage gratuites

    Clothoff.io

    Clothoff.io

    Dissolvant de vêtements AI

    AI Hentai Generator

    AI Hentai Generator

    Générez AI Hentai gratuitement.

    Article chaud

    R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
    2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
    Repo: Comment relancer ses coéquipiers
    4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
    Hello Kitty Island Adventure: Comment obtenir des graines géantes
    3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
    Combien de temps faut-il pour battre Split Fiction?
    3 Il y a quelques semaines By DDD

    Outils chauds

    Bloc-notes++7.3.1

    Bloc-notes++7.3.1

    Éditeur de code facile à utiliser et gratuit

    SublimeText3 version chinoise

    SublimeText3 version chinoise

    Version chinoise, très simple à utiliser

    Envoyer Studio 13.0.1

    Envoyer Studio 13.0.1

    Puissant environnement de développement intégré PHP

    Dreamweaver CS6

    Dreamweaver CS6

    Outils de développement Web visuel

    SublimeText3 version Mac

    SublimeText3 version Mac

    Logiciel d'édition de code au niveau de Dieu (SublimeText3)

    Remplacer les caractères de chaîne en javascript Remplacer les caractères de chaîne en javascript Mar 11, 2025 am 12:07 AM

    Remplacer les caractères de chaîne en javascript

    jQuery Vérifiez si la date est valide jQuery Vérifiez si la date est valide Mar 01, 2025 am 08:51 AM

    jQuery Vérifiez si la date est valide

    jQuery obtient un rembourrage / marge d'élément jQuery obtient un rembourrage / marge d'élément Mar 01, 2025 am 08:53 AM

    jQuery obtient un rembourrage / marge d'élément

    10 onglets jQuery Accordion 10 onglets jQuery Accordion Mar 01, 2025 am 01:34 AM

    10 onglets jQuery Accordion

    10 vaut la peine de vérifier les plugins jQuery 10 vaut la peine de vérifier les plugins jQuery Mar 01, 2025 am 01:29 AM

    10 vaut la peine de vérifier les plugins jQuery

    Http débogage avec le nœud et le http-console Http débogage avec le nœud et le http-console Mar 01, 2025 am 01:37 AM

    Http débogage avec le nœud et le http-console

    Tutoriel de configuration de l'API de recherche Google personnalisé Tutoriel de configuration de l'API de recherche Google personnalisé Mar 04, 2025 am 01:06 AM

    Tutoriel de configuration de l'API de recherche Google personnalisé

    jQuery Ajouter une barre de défilement à div jQuery Ajouter une barre de défilement à div Mar 01, 2025 am 01:30 AM

    jQuery Ajouter une barre de défilement à div

    See all articles