兩個jQuery指令在Firefox中工作，而不是在Chrome中

Question

我想通過點擊一個按鈕來調用一個循環內的ajax。 請在下面找到我的代碼。代碼工作在Mozilla Firefox沒有任何問題。但在Google Chrome步驟1和步驟2，沒有得到執行，它直接進入每個方法。 我的代碼：

$('#button_id').click(function() { 
 
     $(this).prop("disabled", true); /*Step 1*/ 
 
     $(this).html('<li class="fa fa-refresh fa-spin"></li>&nbsp;&nbsp;Please wait..'); /*Step 2*/ 
 
     $.each(MyData, function (i, value) { 
 
      $.ajax({ 
 
       url: "myurl", 
 
       type: "POST", 
 
       dataType: "json", 
 
       async: false, 
 
       success: function (result) { 
 
        alert("success"); 
 
       }, 
 
       error: function (xhr, status, error) { 
 
        alert("Error"); 
 
       } 
 
      }); 
 
     }); 
 
     $(this).html('<li class="fa fa-Send"></li>&nbsp;&nbsp;Submit'); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button type="button" id="button_id" class="btn btn-lg btn-success warning_1 btn-block" style="border-radius: 3px;"><li class="fa fa-send" ></li>&nbsp;&nbsp;Submit</button>

Answer 1

您需要使用$(this)而不是$('this')。單引號應刪除：

$('#button_id').click(function() { 
 
    /*Step 1*/ 
 
    $(this).prop("disabled", true); 
 
    /*Step 2*/ 
 
    $(this).html('<li class="fa fa-refresh fa-spin"></li>&nbsp;&nbsp;Please wait..'); 
 
    $.each(MyData, function(i, value) { 
 
    $.ajax({ 
 
     url: "myurl", 
 
     type: "POST", 
 
     dataType: "json", 
 
     async: false, 
 
     success: function(result) { 
 
     alert("success"); 
 
     }, 
 
     error: function(xhr, status, error) { 
 
     alert("Error"); 
 
     } 
 
    }); 
 
    }); 
 

 
    $(this).html('<li class="fa fa-Send"></li>&nbsp;&nbsp;Submit'); 
 

 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="button_id">Button</button>