jQuery是否禁用锚定标记并选择子元素？

我很难弄明白，也许有人能帮我

这是我的html：

<p>
post content
<span><a href="#" class="voteUp">I approve this message <span>${post.upvotes}</span></a></span>
</p>

<p>
post #2 content
<span><a href="#" class="voteUp">I approve this message <span>${post.upvotes}</span></a></span>
</p>

基本上我想做的是用

data

包含的值更改内部跨度的值。上面的代码确实有效，但它正在更改每个跨度的内容，而不仅仅是单击的锚点的子级

我想做的另一件事是在提交投票后禁用锚标记

有什么办法吗？

试试看

$(document).ready(function() {

    $(".voteUp").click(function() {

        $.post(voteAction({postid: this.id, type: 'up'}), function(data) {

            $(this).children("span").html(data);

        });

        $(this).unbind('click');
    });
});

试一试

尝试：

尝试：

---

请记住，$.post中的回调函数是异步的，因此如果没有适当的框架，就会丢失上下文。因此，这意味着您的

$（'a span'）

搜索整个DOM，因此它将替换所有内容

编辑：好的，Shef正在分裂头发，但让我意识到，使用unbind（或Shef的方法）在单击时仍然不会返回false，因此，当您单击

时，会有一个很好的“踢到顶部”效果。此代码已更新以修复此问题

$("a.voteUp").click(function(){
    //Set a local variable to the anchor that was clicked on for future use
    var $this = $(this);
    $.post(voteAction({postid: this.id, type: 'up'}), function(data){
        $this.find("span").html(data);

        //Unbind this "voteUp" button.  This will remove the click handler and apply a class of "disabled"
        $this.unbind('click').click(function() { return false }).addClass('disabled');
    });
    return false;
});

现在，在CSS中：

.disabled { color: #999; }

---

这将使“禁用”元素中的文本变为灰色。

请记住，$.post的回调函数是异步的，因此如果没有正确的框架，您将丢失上下文。因此，这意味着您的

$（'a span'）

搜索整个DOM，因此它将替换所有内容

编辑：好的，Shef正在分裂头发，但让我意识到，使用unbind（或Shef的方法）在单击时仍然不会返回false，因此，当您单击

时，会有一个很好的“踢到顶部”效果。此代码已更新以修复此问题

$("a.voteUp").click(function(){
    //Set a local variable to the anchor that was clicked on for future use
    var $this = $(this);
    $.post(voteAction({postid: this.id, type: 'up'}), function(data){
        $this.find("span").html(data);

        //Unbind this "voteUp" button.  This will remove the click handler and apply a class of "disabled"
        $this.unbind('click').click(function() { return false }).addClass('disabled');
    });
    return false;
});

现在，在CSS中：

.disabled { color: #999; }

这将使“禁用”元素中的文本变为灰色。

尝试以下操作：

$(".voteUp").click(function(){
    $.post(voteAction({postid: this.id, type: 'up'}), function(data){
        // Replace <span> that's a child of this:
        $('span', this).html(data);
        // Unbind click event from anchor:
        $(this).unbind('click');
    });
});

$（“.voteUp”）。单击（函数（）{
$.post（voteAction（{postid:this.id，键入：'up'}），函数（数据）{
//替换为以下项的子项：
$（'span'，this）.html（数据）；
//从锚点取消绑定单击事件：
$（this.unbind（'click'）；
});
});

如果要删除锚定标记而不是解除单击事件的绑定，请执行以下操作：

$（this.parent（）.html（$（this.html（））
尝试以下操作：

$(".voteUp").click(function(){
    $.post(voteAction({postid: this.id, type: 'up'}), function(data){
        // Replace <span> that's a child of this:
        $('span', this).html(data);
        // Unbind click event from anchor:
        $(this).unbind('click');
    });
});

$（“.voteUp”）。单击（函数（）{
$.post（voteAction（{postid:this.id，键入：'up'}），函数（数据）{
//替换为以下项的子项：
$（'span'，this）.html（数据）；
//从锚点取消绑定单击事件：
$（this.unbind（'click'）；
});
});

如果要删除锚定标记而不是解除单击事件的绑定，请执行以下操作：

$（this.parent（）.html（$（this.html（））
这将从
a
标记中取消绑定
单击事件，但是
a
标记本身仍然可以单击。这是正确的。点击它什么也做不了，这就是我对他的问题的解释。如果他想让它什么都不做，然后变灰，那么他可以添加行来完成。谢谢你的帮助！禁用链接不起作用，但此部分
$this.find（“a span”）.html（数据）
可以，但没有
a
内部查找（就像Goblin建议的那样）。有没有关于禁用链接的想法？我该如何将其灰显？Sled，我很抱歉--我更新了我的代码以修复查找并附加一个类。这将
从
a
标记中取消绑定
单击事件，但
a
标记本身仍然可以单击。这是正确的。点击它什么也做不了，这就是我对他的问题的解释。如果他想让它什么都不做，然后变灰，那么他可以添加行来完成。谢谢你的帮助！禁用链接不起作用，但此部分
$this.find（“a span”）.html（数据）
可以，但没有
a
内部查找（就像Goblin建议的那样）。有没有关于禁用链接的想法？我该如何将其灰显？Sled，我很抱歉--我更新了代码以修复查找和附加类。我应该注意，以上述方式删除标记将替换父元素的全部内容，所以一定要用a包装。我应该注意，以上面的方式删除标记将替换父元素的全部内容，所以一定要用a包装。我没有想过用CSS做这件事。谢谢你的帮助@Sled：是的，在这种情况下，元素的类可以用于样式和逻辑。我没想过用CSS来实现这一点。谢谢你的帮助@Sled：是的，在这种情况下，元素的类可以用于样式和逻辑。