如何延迟ajax响应的秒数

时间:2013-10-18 21:51:08

标签: javascript jquery ajax

我在div容器中通过jQuery ajax加载一些结果。 我希望在延迟2秒后向用户显示结果

我正在使用以下代码

<script type="text/javascript">
$(function() {
    $("#submit").click(function() {
        $('#myform').slideToggle('#loading');
        $('#loginhandle').show("slow");
        var name = $("input#name").val();
        var age = $("input#age").val();
        var dataString = 'name='+ name + '&age=' + age ;
        $.ajax({
            type: "POST",
            url: "results.php",
            data: dataString,
            success: function(msg) {
                $('#loading').slideToggle('#results');
                $('#results').show("slow");
                $('#results').html(msg)
                .hide()
                .fadeIn(1500, function() {
                });
            }
        });
        return false;
    });
});
</script>

在contianer上显示的结果

<div id='loading' style='display:none'>
Please wait for while
</div>

<div id='results' style='display:none'>
<div id='results' class='results'></div>
</div>

我对此部分的代码进行了更改

$('#loading').slideToggle('#results');

setTimeout(function() {
    $('#loading').slideToggle('#results');
}, 2000);

但它只会延迟装载容器,因此在显示“请稍候”时会显示结果 那我怎么能拖延呢?

3 个答案:

答案 0 :(得分:3)

如果我误解了,请纠正我,但是要延迟一切,只需将所有成功函数代码放入setTimeout函数中。

success: function(msg) {
   setTimeout(function() {
     $('#loading').slideToggle('#results');
     $('#results').show("slow");
     $('#results').html(msg).hide().fadeIn(1500, function() {

     });}, 2000);      
 });

答案 1 :(得分:2)

您只需修改success回调:

即可
success: function(msg) {
    setTimeout(function() {
        $('#loading').slideToggle('#results');
        $('#results').show("slow");
        $('#results').html(msg).hide().fadeIn(1500, function() {

        });
    }, 2000);
}

答案 2 :(得分:1)

要实现想要的结果,您应该更改

中的代码
setTimeout(function() {
   $('#loading').slideToggle('#results');
   $('#results').show("slow");
   $('#results').html(msg)
}, 2000);

原因是setTimeout仅延迟您作为参数传递的闭包中的代码包含。