jQuery .submit（）成功或失敗觸發器

Question

我正在使用.submit()定期通過ajax提交表單，但我希望用戶看到表單正在用旋轉輪保存，然後「保存」！一旦成功。在jQuery中是否有success觸發器.submit()？

謝謝！

Answer 1

您可以使用手動$.post()請求而不是.submit()。 $.post()有一個成功的回調。

您必須填寫$.post()（目標網址）和.serialize()表單元素的詳細信息。

Answer 2

試試這個：

的jQuery：

$(document).ready(function() { 
    $('#form').submit(function() { 
     var status = '<img class="loading" src="loading_detail.gif" alt="Loading..." />'; 
     $("#ajax").after(status); 
     $.ajax({ 
      type: 'POST', 
      url: $(this).attr('action'), 
      data: $(this).serialize(), 
      dataType: 'json', 
      success: function(json) { 
       if(json.type == 'success') { 
        $('#msg').css("color","green").html(json.message); 
       } else if(json.type == 'warning'){ 
        $('#msg').css("color","yellow").html(json.message); 
       } else if(json.type == 'error'){ 
        $('#msg').css("color","red").html(json.message); 
       } 
       $('.loading').remove(); 
      } 
     }) 
     return false; 
    }); 
}); 

HTML：

<div id="msg"></div> 
<form id="form" method="post" action="action.php" > 
    <input type="text" name="email" /> 
    <input type="submit" name="submit" value="submit" /><span id="ajax"></span> 
</form> 

action.php的：

<?php 
if(isset($_POST['email'])){ 
$val = $_POST['email']; 
switch ($val) { 
    case 'email@site.com': 
     $return = array('type'=>'success', 'message'=>'This is success message!'); break; 
    case 'email': 
     $return = array('type'=>'warning', 'message'=>'This is warning message!'); break; 
    default: 
     $return = array('type'=>'error', 'message'=>'This is error message!'); 
} 
echo json_encode($return); 
} 
?> 

注： 如果您以編程方式提交表單，則需要再次調用$('#form').submit()，但這次沒有參數，以便觸發提交事件。

Answer 3

要提交一個頁面時顯示一個轉輪，嘗試獲得一個動畫GIF（有很多免費的加載圈）。在你的頁面此GIF實現具有：

class="myloadingcircle" style="display:none" 

，然後使用jQuery：

$("form").submit(function(e) { $(".myloadingcircle").show(); });