使用JQuery清空动态加载的span

Question

我有一个动态加载的按钮，如下所示：

<button type="button" class="btn btn-default admire"><span class="font awesome"> 3</span></button>

我正在尝试清空文本值，在本例中为3，并在单击按钮时使用AJAX调用的返回值更新它。到目前为止，这是我的代码：

$(document.body).on("click", "button.admire", function(){    
$.post('ajax/example.php', function(data){
$(this).find("span").empty();
$(this).find("span").append(data);
});
});

它不像被开除的那样工作。是＆＃34;这个＆＃34;，按钮，仍然可以在ajax功能中引用？还是超出范围？

编辑：我如何在ajax调用函数中引用此span？

谢谢，

威廉

Answer 1

如果我理解你，请尝试这样做，并且不要忘记将课程添加到btn

 $(document.body).on("click", "button.admire", function(){ 
   var btn = $(this);
 $.ajax({
   url : "your link",
   type: "POST",
   dataType: "Json",//by default it's returning html
   data: "your data",// if you sending data
   async: "false", // it is mean, that until ajax request is not completed it not going forword
   complete: function (response) {

     btn.find("span").empty();
     btn.find("span").append(response.yourresponse);

   }

  })

 })

Answer 2

问题在于this指的是$.post回调函数的this而不是按钮的this。您需要通过将其指定给变量来保留其引用。

示例：

$(document.body).on("click", "button.admire", function(){  
  var span = $(this).find('span');
  $.post('ajax/example.php', function(data){
    span.empty();
    span.append(data);
  });
});