在ajax调用中设置延迟

我试图在加载器图标和以html为数据的成功之间添加一个小延迟（2秒）。在ajax调用中设置延迟

我试过使用的是setTimeout并放入一个延迟号。这不起作用，所以我希望你能告诉我什么是正确的方法。

我的Ajax代码：

<script type="text/javascript"> 

$(function() { 

    var delay = 2000; 

    var res = { 
     loader: $("<div />", { class: "loader" }) 
    }; 

    $('#search').on('click', function() { 
     $.ajax({ 
      type: 'GET', 
      url: "@Url.Action("Find", "Hotel")", 
      datatype: "html", 
      beforeSend: function() { 
       $("#group-panel-ajax").append(res.loader); 
       setTimeout(delay); 
      }, 

      success: function (data) { 
       $("#group-panel-ajax").find(res.loader).remove(); 
       $('#group-panel-ajax').html($(data).find("#group-panel-ajax")); 
      } 
     }); 
     return false; 
    }); 
}); 

</script>

现在它运行非常快。希望有人能帮忙。

来源

2015-10-28 Mikkel

那不是如何'setTimeout'作品。您是否阅读过[documentation]（https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setTimeout）？ – j08691

你在哪里看过'setTimeout'被用作'setTimeout（delay）'？我会找到更好的源代码/教程/文档。 –

你究竟想要推迟什么？发送请求之前你想要延迟吗？或者在收到答复之后并在显示结果之前想要延迟？ –

setTimeout应内部使用successfunction。

$(function() { 
 
    var delay = 2000; 
 
    var res = { 
 
    loader: $("<div />", { 
 
     class: "loader" 
 
    }) 
 
    }; 
 
    $('#search').on('click', function() { 
 
    $.ajax({ 
 
     type: 'GET', 
 
     url: "@Url.Action("Find", "Hotel")", 
 
     datatype: "html", 
 
     beforeSend: function() { 
 
     $("#group-panel-ajax").append(res.loader); 
 
     }, 
 
     success: function(data) { 
 
     setTimeout(function() { 
 
      delaySuccess(data); 
 
     }, delay); 
 
     } 
 
    }); 
 
    return false; 
 
    }); 
 
}); 
 

 
function delaySuccess(data) { 
 
    $("#group-panel-ajax").find(res.loader).remove(); 
 
    $('#group-panel-ajax').html($(data).find("#group-panel-ajax")); 
 
}

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

来源

2015-10-28 15:34:34

非常感谢你..作品像一个魅力。 – Mikkel

这里的东西，我发现，当我想要做相同的：

function doStuff() 
{ 
    //do some things 
    setTimeout(continueExecution, 10000) //wait ten seconds before continuing 
} 

function continueExecution() 
{ 
    //finish doing things after the pause 
}

希望它会帮助你的

来源

2015-10-28 15:30:04

使用setTimeout()这样的：

<script type="text/javascript"> 

$(function() { 

    var delay = 2000; 

    var res = { 
     loader: $("<div />", { class: "loader" }) 
    }; 

    $('#search').on('click', function() { 
     $.ajax({ 
      type: 'GET', 
      url: "@Url.Action("Find", "Hotel")", 
      datatype: "html", 
      beforeSend: function() { 
       $("#group-panel-ajax").append(res.loader); 

      }, 

      success: function (data) { 
       setTimeout(function(){ 
        $("#group-panel-ajax").find(res.loader).remove(); 
        $('#group-panel-ajax').html($(data).find("#group-panel-ajax")); 
       }, delay); 

      } 
     }); 
     return false; 
    }); 
}); 

</script>

来源

2015-10-28 15:33:26 Ragnar

$(function() { 
 
    var delay = 2000; 
 
    var res = { 
 
    loader: $("<div />", { 
 
     class: "loader" 
 
    }) 
 
    }; 
 
    $('#search').on('click', function() { 
 
    $.ajax({ 
 
     type: 'GET', 
 
     url: "@Url.Action("Find", "Hotel")", 
 
     datatype: "html", 
 
     beforeSend: function() { 
 
     $("#group-panel-ajax").append(res.loader); 
 
     }, 
 
     success: function(data) { 
 
     setTimeout(function() { 
 
      delaySuccess(data); 
 
     }, delay); 
 
     } 
 
    }); 
 
    return false; 
 
    }); 
 
}); 
 

 
function delaySuccess(data) { 
 
    $("#group-panel-ajax").find(res.loader).remove(); 
 
    $('#group-panel-ajax').html($(data).find("#group-panel-ajax")); 
 
}

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

来源

2017-03-15 23:27:47 user1739043

你应该添加一个你的答案的小解释。 – Neil

在ajax调用中设置延迟

回答

相关问题