2010-11-27 7 views
10

Je suis en train de créer un code qui affiche les informations de l'utilisateur sur la recherche. Les informations de l'utilisateur sont ensuite affichées dans un fieldset, avec une image, un prénom, un nom de famille et quelques informations sur le profil. est représentée, et dans le fond du fieldset, il y a un lien hypertexte Ajouter comme ami:jquery <a> tag click événement

<a href="#" id="aaf">add as friend</a> 

Maintenant, je veux utiliser la méthode jquery $post() pour interagir avec une autre page. J'ai également un champ caché à l'intérieur de cet utilisateur fieldset qui a la valeur de l'ID de l'utilisateur. Maintenant, lorsque je crée une fonctionnalité de clic en utilisant jquery, je ne suis pas en mesure d'accéder aux différentes valeurs de champ caché. Maintenant, je veux savoir comment réaliser cette fonctionnalité? Pour vérifier si je peux obtenir la valeur des champs cachés dans un ensemble de code, je l'ai fait.

$(document).ready(function() { 
    $("a#aaf").bind('click', function() { 
     alert($("#uid").val()); 
    }); 
}); 

Mais je n'obtenir la valeur de la première fieldset, pas d'autres. Veuillez me guider dans ceci.

Merci d'avance.

EDIT: Comment l'obtenir dans chaque événement click click? Je mets un peu plus de code ici,

<?php foreach($query->result() as $row){?> 
<fieldset> 
    <legend> 
     <?php echo $row->firstname.' '.$row->lastname;?> 
    </legend> 
    <img src='<?php echo $row->profile_img_url;?>'/><br> 
    <a href="#" id="aaf">add as friend</a> 
    <input name="uid" type="hidden" value='<?php echo $row->uid;?>' id="uid"> 
</fieldset> 

Répondre

22
<a href="javascript:void(0)" class="aaf" id="users_id">add as a friend</a> 

sur jquery

$('.aaf').on("click",function(){ 
    var usersid = $(this).attr("id"); 
    //post code 
}) 

// autre méthode consiste à utiliser les données d'attributs

<a href="javascript:void(0)" class="aaf" data-id="102" data-username="sample_username">add as a friend</a> 

sur jquery

$('.aaf').on("click",function(){ 
    var usersid = $(this).data("id"); 
    var username = $(this).data("username"); 
}) 
+2

Remarque .live() est dépréciée dans les jQueries les plus récentes. Utilisez .on() à la place. – rogueleaderr

4

C'est parce que vos champs masqués ont des ID en double, de sorte que jQuery ne retourne que le premier dans l'ensemble. Donnez-leur des classes au lieu, comme .uid et les attraper par:

var uids = $(".uid").map(function() { 
    return this.value; 
}).get(); 

Démo: http://jsfiddle.net/karim79/FtcnJ/

EDIT: dire que votre sortie se présente comme suit (avis, les ID ont changé pour les classes)

<fieldset><legend>John Smith</legend> 
<img src='foo.jpg'/><br> 
<a href="#" class="aaf">add as friend</a> 
<input name="uid" type="hidden" value='<?php echo $row->uid;?>' class="uid"> 
</fieldset> 

Vous pouvez cibler l''UID' relatif à l'ancre cliquée comme ceci:

$("a.aaf").click(function() { 
    alert($(this).next('.uid').val()); 
}); 

Important: aucun ID en double. Ils vont causer des problèmes. Ils sont invalide, mauvais et vous devriez pas le faire.

+0

ok, je vais essayer cela, et nous le laisserons savoir les gars ... merci pour cela. – Maverick

2

Tous les champs cachés dans votre fieldset sont en utilisant le même id, si jquery est seulement rétu le premier. Une façon de résoudre ce problème consiste à créer une variable de compteur et à la concaténer à chaque ID de champ masqué.