Question

我正在创建一个类似的系统，但我遇到了一个问题，当用户按下时，“喜欢”文字应改为“删除像”

数据来自php查询，因此有许多具有相同类的项目

<table class="UserHistoryTable">
<td data-rowtype="stat" data-rowuser="1" data-rowid="1" class="UserHistoryTableTD">
<a href="#" class="like">Like</a></td>
</table>

data-rowuser是用户按下like按钮的id，data-rowid是活动的id 我想做的是，当有人按下“喜欢”链接时，它应该改为“删除喜欢” 我尝试过这段代码：

$('.like').click(function(){
var the_id = $(this).parent().data('rowid')
var user_id = $(this).parent().data('rowuser')
var user_id = $(this).parent().data('rowtype')
   $.ajax({
      url: "like.php",
      data: "action=likestat" + "&id=" + the_id + "&uid=" + user_id,
         success:function(response){
            var findtext = $('.UserHistoryTableTD > .like', this);
            $(findtext).replaceWith("Remove like");
       }
   });
});

Answer 1

你有几个问题。 this在成功处理程序中仍然不是您想要的值（它将具有与ajax调用相关的不同值）。 >选择器表示直接子节点，.like不是父表的直接子节点。如果将this的值保存在局部变量中，则可以直接在ajax处理程序中使用它。

将代码更改为：

$('.like').click(function(){
    var the_id = $(this).parent().data('rowid')
    var user_id = $(this).parent().data('rowuser')
    var self = this;  // save for use in success handler
    $.ajax({
        url: "like.php",
        data: "action=likestat" + "&id=" + the_id + "&uid=" + user_id,
        success:function(response){
            $(self).html("Remove like");
       }
   });
});

你也可以这样干它：

$('.like').click(function(){
    var $self = $(this);              // save this for use later
    var $td = $self.closest("td");    // find correct parent, regardless of other markup
    $.ajax({
        url: "like.php",
        data: "action=likestat" + "&id=" + $td.data('rowid') + "&uid=" + $td.data('rowuser'),
        success:function(response){
            $self.html("Remove like");
       }
   });
});

Answer 2

您无法使用this内部成功，因此您可以在成功事件之外保存$(this)的var。

$('.like').click(function(){
var like_button = $(this);
var the_id = $(this).parent().data('rowid');
var user_id = $(this).parent().data('rowuser');
var user_id = $(this).parent().data('rowtype'); // something is wrong here :s
   $.ajax({
      url: "like.php",
      data: "action=likestat" + "&id=" + the_id + "&uid=" + user_id,
         success:function(response){
            like_button.replaceWith("Remove like");
       }
   });
});

（根据詹姆斯评论的建议编辑）

第4/5行出了点问题。

Answer 3

你应该能够做到：

$(this).html("Remove like");

在点击事件处理程序中。

Answer 4

使用jQuery的.html()函数可以更轻松地完成 http://jsfiddle.net/Hz7WY/

目：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$('.like').click(function(){
var the_id = $(this).parent().data('rowid')
var user_id = $(this).parent().data('rowuser')
var user_id = $(this).parent().data('rowtype')
      $('.like').html('Unlike');
});
</script>

体：

<table class="UserHistoryTable">
<td data-rowtype="stat" data-rowuser="1" data-rowid="1" class="UserHistoryTableTD">
<a href="#" class="like">Like</a></td>
</table>

jQuery替换锚内的文本

4 个答案: