函数执行后重新加载页面

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