Question

我有一个在页脚中有这些按钮的表单

<button type="button" class="btn btn-warning redirect store-submit">Add and redirect</button>
<button type="submit" class="btn btn-success store-submit">Just add</button>

虽然这些不提交表格。它们用于触发jQuery事件

$("button").click(function(e){
 if($(this).hasClass('store-submit')){  
   e.preventDefault();
   var form_action = $("#add-modal").find("form").attr("action");
   var data = $("#add-modal").find("textarea[name='data']").val();
   var token = $('meta[name="csrf-token"]').attr('content');
   var type = {{$user->type}};
   $.ajax({
       dataType: 'json',
       type:'POST',
       url: form_action,
       data:{data:data, _token:token}
   }).done(function(data){
       $("#add-modal").modal('hide');
       update(data.id); //calling out another function
        if($(this).hasClass('redirect')){      //DOESNT WORK
            //some action
         }
   }).error(function(data){
     //error
    });
}
});

奇怪的是，第一次检查是有效的。无论我点击什么按钮，它都不会在上课时触发部分＆＃34;重定向＆＃34;检查。我有点难以解决这个问题，我不知道我可能做错了什么。任何帮助都会受到高度赞赏。

度过愉快的一天。

Answer 1

您需要将回调函数绑定到正确的上下文。一种方法是使用Function.prototype.bind：

.done(function(data) {
   $("#add-modal").modal('hide');
   update(data.id); // calling out another function
   if ($(this).hasClass('redirect')) {
      //some action
   }
 }.bind(this)) // note: bind(this) call

Answer 2

您的$(this)不再指向该按钮了。为了解决这个问题，您可以按照@dfsq的建议使用.bind()，也可以将$(this)分配给变量，然后再使用它。像

var btn = $(this);

以后使用上面的

.done(function(data) {
  $("#add-modal").modal('hide');
  update(data.id);
  if(btn.hasClass('redirect')) {
    //some action
  }

此外，这里的好处是你不必在任何地方都拨打$(this)，因为你在变量中持有$(this)的引用。所以你也可以改变

if($(this).hasClass('store-submit')) {

要

if(btn.hasClass('store-submit')) { 

//and practically everywhere you can use btn instead of $(this)

jQuery - hasClass问题

2 个答案: