我想延迟jQuery ajax成功的功能

时间:2016-11-27 14:16:45

标签: jquery ajax delay replacewith

我想让用户在块内的HTML更改之前等待2秒。你能帮我设一些时间,以便ajax请求不那么快,我有时间展示一些动画

我尝试设置超时但是无法正常工作

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

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

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

});
<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>

1 个答案:

答案 0 :(得分:3)

在成功回调函数中使用setTimeout

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