jquery <a> tag click event</a>

时间:2010-11-27 23:27:03

标签: jquery html ajax post

我正在构建一个显示搜索用户信息的代码。然后,用户信息将显示在fieldset中,以及图像,名字,姓氏和少量个人资料信息。显示,在fieldset的底部,有一个添加为朋友的超链接:

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

现在我想使用jquery $post()方法与另一个页面进行交互。我在用户fieldset中也有一个隐藏字段,其中包含用户标识值。现在,当我使用jquery创建点击功能时,我无法访问不同的隐藏字段值。现在我想知道如何实现这个功能?为了检查我是否可以在一组代码中获取隐藏字段的值,我做了这个。

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

但我只获得了第一个fieldset的价值,而不是其他人的价值。请指导我。

提前致谢。

编辑:如何在每个标签点击事件中获取它?我在这里添加更多代码,

<?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>

3 个答案:

答案 0 :(得分:34)

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

on jquery

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

//其他方法是使用数据属性

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

on jquery

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

答案 1 :(得分:5)

那是因为你的隐藏字段有重复的ID,所以jQuery只返回集合中的第一个。改为给他们上课,比如.uid,并通过以下方式抓住他们:

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

演示:http://jsfiddle.net/karim79/FtcnJ/

编辑:说你的输出如下(通知,ID已更改为类)

<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>

您可以将“uid”相对于点击的锚定位,如下所示:

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

重要提示:没有任何重复的ID。它们会引起问题。它们无效错误,您应该这样做。

答案 2 :(得分:2)

字段集中的所有隐藏字段都使用相同的ID,因此jquery仅返回第一个字段。解决此问题的一种方法是创建一个计数器变量并将其连接到每个隐藏的字段ID。