在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調用中設置延遲

回答

相關問題