2016-11-27 21 views
0

ブロック内のHTMLが変更される前に、ユーザーが2秒待機するようにします。あなたは、Ajaxリクエストがそれほど速くはなかったと私はタイムアウトを設定しようとしたjQuery ajax成功関数を遅らせたい

いくつかのアニメーションを表示するための時間を持っていたように、私はいくつかの時間を設定するのに役立つことができますが、それが動作していない

jQuery(document).ready(function($) { 
 

 
$(document).on('click', '#wp-request', function(event){ 
 
\t    event.preventDefault(); \t 
 
      \t var path = myScript.pluginsUrl + '/simple/widget-final.php'; 
 
\t \t \t \t $.ajax({ 
 
\t \t \t \t \t type : 'POST', 
 
             url: path, 
 
             cache: false, 
 
\t \t \t \t \t success : function(data){ 
 
\t \t \t \t \t var newWidget = $(data); 
 
\t \t \t \t \t $('#widget-container').replaceWith(newWidget); 
 
\t \t \t \t \t }, 
 
\t \t \t \t \t error : function(){ alert('Error'); }, 
 
\t \t \t \t \t dataType : 'html' 
 
       }); 
 
\t \t \t \t 
 
}); 
 

 
$(document).on('click', '#wp-back', function(event){ 
 
\t \t \t \t event.preventDefault(); 
 
\t \t \t \t var path = myScript.pluginsUrl + '/simple/widget-initial.php'; 
 
\t \t \t \t $.ajax({ 
 
\t \t \t \t \t type : 'POST', 
 
             url: path, 
 
             cache: false, 
 
\t \t \t \t \t success : function(data){ 
 
\t \t \t \t \t var newWidget = $(data); 
 
\t \t \t \t \t $('#widget-container').replaceWith(newWidget); 
 
\t \t \t \t \t }, 
 
\t \t \t \t \t error : function(){ alert('Error'); }, 
 
\t \t \t \t \t dataType : 'html' 
 
       }); 
 
\t \t \t \t 
 
}); 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="widget-container"> 
 
<p>We are on first page</p> 
 
<a id="wp-request" href="">Send</a> 
 
</div>

+0

成功コールバック内で 'setTimeout'を適用してください。 –

答えて

2

成功コールバック関数でsetTimeoutを使用してください。

success : function(data){ 
    setTimeout(function(){ 
     var newWidget = $(data); 
     $('#widget-container').replaceWith(newWidget); 
    },2000); // The millis to wait before executing this block 
}, 
+0

うわー、うまくいきます。ありがとうございました。すばらしいです – kilogram

関連する問題