Comment obtenir l'ID de l'élément cliqué avec jQuery ?

Question

J'ai le code html suivant :

<a href="#" id="#1" class="pagerlink" >link</a>
<a href="#" id="#3" class="pagerlink" >link</a>
<a href="#" id="#2" class="pagerlink" >link</a>
/*etc.... */

et le jQuery script suivant :

$(document).ready(function() {

    var $container = $('.gallery_r').cycle({ 
        fx:     'scrollHorz', 
        speed:   500, 
        timeout: 0 
    }); 

    $('a.pagerlink').click(function() { 
        var id = $(this).attr('id');
        $container.cycle(id); 
        return false; 
    }); 

});

le contrôle des liens 'pagerlink' est un diaporama jQuery Cycle. Si je permute cette ligne :

$container.cycle(id); 

pour cette

$container.cycle(7); 

cela fonctionne... (évidemment en ne naviguant que vers la diapositive numéro 7). Ma question est donc la suivante : comment puis-je récupérer l'ID du lien sur lequel on clique et le passer dans cette ligne ?

Merci d'avance !

Answer 1

Vos identifiants sont #1 et cycle veut juste qu'on lui passe un nombre. Vous devez supprimer le # avant d'appeler cycle .

$('a.pagerlink').click(function() { 
    var id = $(this).attr('id');
    $container.cycle(id.replace('#', '')); 
    return false; 
});

De plus, les ID ne doivent pas contenir l'élément # il n'est pas valide (les ID numériques ne sont pas non plus valides). Je suggère de changer l'ID en quelque chose comme pager_1 .

<a href="#" id="pager_1" class="pagerlink" >link</a>

$('a.pagerlink').click(function() { 
    var id = $(this).attr('id');
    $container.cycle(id.replace('pager_', '')); 
    return false; 
});

Answer 2

Il suffit d'enlever le hachage du début :

$('a.pagerlink').click(function() { 
    var id = $(this).attr('id').substring(1);
    $container.cycle(id); 
    return false; 
});

Answer 3

@Adam Ajoutez simplement une fonction en utilisant onClick="getId()"

function getId(){console.log(this.event.target.id)}

Answer 4

Votre identifiant sera transmis comme #1, #2 etc. Cependant, # n'est pas un identifiant valide (les sélecteurs CSS préfixent les identifiants avec #).

Answer 5

Tout d'abord, vous ne pouvez pas avoir un simple numéro pour votre identifiant, sauf si vous utilisez le DOCTYPE HTML5. Deuxièmement, vous devez soit supprimer le # dans chaque id, soit le remplacer par ceci :

$container.cycle(id.replace('#',''));