顯示加載圖標，然後重定向到新頁面

可以說我有一個頁面「page1」，它由一些信息和一個名爲「Add」的按鈕組成。顯示加載圖標，然後重定向到新頁面

當我點擊這個按鈕時，它會打開一個彈出式模式窗口，它由一個大約有10個字段的窗體組成，並提交按鈕。一旦我點擊這個按鈕，我用ajax post提交表單，並在服務器端插入並更新操作並返回成功或失敗結果。

在這個ajax過程中，我顯示一個加載圖像。我正在嘗試的是在這個加載映像之後它應該重定向到新的頁面。讓我們說「page2」。但在我的代碼中，我看到加載停止後，我看到模式窗口和「page1」大約2-3秒，然後只有它重定向到「page2」。

我不確定我的問題是否合乎邏輯，但仍然有任何方法可以阻止它。下面我有一個ajax處理代碼。

謝謝。

$.ajax({ 
     type: 'POST', 
     url: 'page2.php', 
     data: { 
      'data': form_data 
     }, 
     success: function(response) 
     { 
      var arr = JSON.parse(response); 
      if(arr.success == true) { 
       window.location.href = 'page3.php'; 
      } 
      else { 
       alert('There are some error while saving record.'); 
      } 
     }, 
     beforeSend: function() 
     { 
      $('.loader').show().delay(9000); 
     }, 
     complete: function(){ 
      $.fancybox.close(); 
      $('.loader').hide(); 
     } 
    });

來源

2017-06-16 S S

您是否嘗試移動'$（'。loader'）。hide（）;'到'success'裏面的最後一行？ – Arg0n

如果你重定向成功，爲什麼即使有'$（'。loader'）。hide（）;'在完成時，圖像將因爲你被重定向到一個不同的頁面而離開。你需要的唯一地方就是你的'警報'的位置。 – George

@George謝謝。現在我明白了 –

$.ajax({ 
    success: function(response) 
    { 
     ... 
     if(arr.success == true) { 
      ... 
     } 
     else { 
      ... 
      $('.loader').hide(); 
     } 
    }, 
    ... 
    complete: function(){ 
     $.fancybox.close(); 
    } 
});

ajaxrequest完成後不要隱藏裝載機。

來源

2017-06-16 13:05:10

可能值得添加它們需要將它添加到'else'塊的if（arr.success == true）' – George

是的，你是對的。應該隱藏彈出窗口，因爲沒有重定向。 –

@AndreiTodorut非常感謝 –

顯示加載圖標，然後重定向到新頁面

回答

相關問題