在ajax调用中设置延迟答案

【问题标题】：Set a delay in ajax call在ajax调用中设置延迟
【发布时间】：2016-01-28 11:05:53
【问题描述】：

我正在尝试在加载器图标和数据为 html 的成功之间添加一个小延迟（2 秒）。

我尝试使用的是 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>

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

【问题讨论】：

setTimeout 不是这样工作的。你读过上面的documentation 吗？
你在哪里看到setTimeout被用作setTimeout(delay)？我会找到更好的来源/教程/文档。
您实际上想延迟什么？您想在发送请求之前延迟吗？或者您希望在收到响应之后和显示结果之前延迟？
在回答问题之前至少给他一些时间检查setTimeout()是如何工作的

标签： javascript jquery ajax delay settimeout

【解决方案1】：

setTimeout 应在success function 内使用。

$(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"));
}

&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案2】：

当我想做同样的事情时，我发现了一些东西：

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

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

希望对你有帮助

【讨论】：

【解决方案3】：

像这样使用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>

【讨论】：