0

我很难使用 jquery 即时更改此链接的 ID。我可以更改链接文本,但不能更改 ID。有任何想法吗?

<a href="#" id="follow-5">follow</a>

当您单击链接时,我希望它看起来像:

<a href="#" id="following-5">following</a>

这是我的jQuery代码

$("a[id^='follow']").live('click', function(e) {
    e.preventDefault();
    var aid = $(this).attr('id').substring(7);
    $.ajax({
        type: "POST", url: "/artist/", data: "command=becomeFan&aid=" + aid,
        dataType: "html",
        success: function(data){
            $("#follow-" + aid).text("Following");
            $("#follow-" + aid).prev("a").attr("id","following-" + aid);
        }
    });
    return false;
});
4

1 回答 1

2

那么问题是您的代码不会尝试更改该元素的 id 它会尝试更改.prev()元素的 id。所以改变:

$("#follow-" + aid).prev("a").attr("id","following-" + aid);

到:

$("#follow-" + aid).attr("id","following-" + aid);

它应该工作。但是鉴于您已经在该行上选择了相同的元素,然后才应该链接.attr调用:

        $("#follow-" + aid).text("Following")
                           .attr("id","following-" + aid);

或者不是通过 id 重新选择元素,而是在进行 Ajax 调用之前保存对它的引用:

$("a[id^='follow']").live('click', function(e) {
    e.preventDefault();
    var $this = $(this),
        aid = $this.attr('id').substring(7);
    $.ajax({
        type: "POST", url: "/artist/", data: "command=becomeFan&aid=" + aid,
        dataType: "html",
        success: function(data){
            $this.text("Following").attr("id","following-" + aid);
        }
    });
    return false;
});

另请注意,您对属性的使用以 selector with 开头,$("a[id^='follow']")即使在它们的 id 更改后也会继续选择这些元素,但是在您更改 id 后,使用.substring(7)从末尾获取 id 将不起作用。您可能希望将其更改为,$("a[id^='follow-']")以便单击处理程序仅适用于尚未单击的链接。

于 2012-08-21T02:11:00.587 回答