函數執行后重新加載頁面

Question

我有一個像下面這樣的簡單javascript代碼，我想在fadeOut和fadeIn字段之后重新加載頁面，但是我不知道應該將window.location.reload();放在哪里window.location.reload(); 功能。 你有什么建議嗎 ？ 我是JavaScript新手。

    <script>$(document).ready(function() {

        $('.updateButton').on('click', function() {
        var member_id = $(this).attr('member_id');
        var city = $('#city'+member_id).val();
        var continent = $('#continent'+member_id).val();
        var country = $('#country'+member_id).val();
        var id = $('#id'+member_id).val();

        req = $.ajax({
            url : '/deleteRequest',
            type : 'POST',
            data :
                {city : city,continent : continent,country : country,id : id}
        });
        req.done(function(data) {
            $('#city'+member_id).fadeOut(500).fadeIn(500);
            $('#continent'+member_id).fadeOut(500).fadeIn(500);
            $('#country'+member_id).fadeOut(500).fadeIn(500);
            $('#id'+member_id).fadeOut(500).fadeIn(500);
             });

    });
});
</script>

Answer 1

放入超時功能

  req.done(function(data) {
                    $('#city'+member_id).fadeOut(500).fadeIn(500);
                    $('#continent'+member_id).fadeOut(500).fadeIn(500);
                    $('#country'+member_id).fadeOut(500).fadeIn(500);
                    $('#id'+member_id).fadeOut(500).fadeIn(500);
                     setTimeout(function(){
                     window.location.reload();
                       },TotalTimeNeededbyThheAnimationInmiliseconds)
                     });

            });

Answer 2

req.done(function(data) {
        $('#city'+member_id).fadeOut(500).fadeIn(500);
        $('#continent'+member_id).fadeOut(500).fadeIn(500);
        $('#country'+member_id).fadeOut(500).fadeIn(500);
        $('#id'+member_id).fadeOut(500).fadeIn(500);
        window.location = '';  // This will reload your page.
});

Answer 3

這是更新的代碼，您可以查看並嘗試。 我已經合並了所有元素， fadeIn有一個回調，您可以在其中刷新頁面。 因此，只有在fadeIn完成后才會重新加載頁面：

$('#city' + member_id + ',#continent' + member_id + ', #country' + member_id + ', #id' + member_id).fadeOut(500).fadeIn(500, function() {
  location.reload();
});

Answer 4

你應該試試

req.always(function(){
    window.location.reload();
});

無論是否引起共鳴，它都會一直有效。如果您想在收到回復后重新載入，可以在這里查看教程。

Answer 5

在最新的jQuery中

棄用通知：

 The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks will be deprecated in jQuery 1.8. To prepare your code for their 

最終刪除，請改用jqXHR.done（），jqXHR.fail（）和jqXHR.always（）。

使用.done() .fail()和.always()而不是success() ， error()和complete() 。

我相信您只想在ajax成功時淡出和隱藏，因此將其放置在done() 。

如果您想在每次ajax完成時重新加載，請使用always()

例如：

req.always(function(){
   window.location.reload(false); 
// If we needed to pull the document from
//  the web-server again (such as where the document contents
//  change dynamically) we would pass the argument as 'true'.
});

要么

如果您都希望同時在done()

req.done(function(){
 // you fadein,fadeout code 

window.location.reload();
});