ajax成功后重新加载页面

Posted 2023-02-22

【中文标题】ajax成功后重新加载页面

【英文标题】：Reload the page after ajax success

【发布时间】：2011-12-14 10:19:22

【问题描述】：

在成功调用 ajax 后，我在重定向/重新加载时遇到了一些问题。 情况如下：

我将要删除的项目保存在一个数组中。当我单击一个按钮时，它通过 ajax 调用 php 文件，成功后我需要重新加载页面。但是我这样做有一些问题。 我搜索了互联网，但找不到有效的解决方案。

我有 PHP 文件，它通过数组从数据库中逐项删除。

foreach($arrayVals as $key=>$val)

    //bla bla

另外，我有 jQuery 部分：

$("#button").live("click",function()
    $.ajax(
        url, data, type... not important
        success: function(html)
                    location.reload();
                
    );
);

我的意思是，代码有效，但不好。它确实删除了项目，但不是全部，然后重新加载页面。 比如，如果我有 10 项要删除，它会删除 6-7 项，而 3-4 项则保持未删除状态。

它的行为就像它过早地重新加载页面，就像 PHP 文件没有足够的时间来处理所有内容：D

【问题讨论】：

为什么要使用 AJAX 来重新加载页面...看起来 UI 很差。

您的 AJAX 查询（以及为什么要使用一个？）被触发一次然后被遗忘，因此在删除完成之前它不会重新加载。很可能您提交的要删除的项目列表不完整，或者不准确，或者您的 PHP 编写不正确。无论如何，我们都需要更多代码。

Jason：我倾向于同意，但每条规则或准则都有例外。 ;-) 例如会话到期。我不确定这个是否属于例外类别；信息不足。

杰森，我明白这一点。我想使用 ajax 调用然后重新加载（而不仅仅是完成后重新加载 php）的唯一原因是设计。如果我将图像作为项目删除，我希望它看起来更漂亮，带有加载栏并在删除时逐个图像分离，然后在完成后重新加载。 :)

它现在可以工作了 :) 我对我的 PHP 文件进行了一些更改以以不同的方式工作，并将我的 jQuery 更改为如下所示： $.ajax( ... success:function(html ) $(".myDiv").replaceWith(html); ); $(this).ajaxStop(function() window.location.reload(); );感谢您的努力:)

【参考方案1】：

BrixenDK 是对的。

.ajaxStop() 回调在所有 ajax 调用完成时执行。这是放置处理程序的最佳位置。

$(document).ajaxStop(function()
    window.location.reload();
);

【讨论】：

它现在可以工作了，对 PHP 进行了一些更正并使用了您的 ajaxStop 建议，谢谢 :)

你为什么不接受这个答案。所以其他人也可以受益。

对不起，这是我第一次访问这个网站，没有注意到复选标记：S

@VikasNaranje，我想知道我应该在哪里添加此代码？内部成功函数？

它运行良好，但挑战在于，它绕过了 ajax 成功函数中的成功消息。

【参考方案2】：

你使用 ajaxStop 在 ajax 完成后执行代码：

$(document).ajaxStop(function()
  setTimeout("window.location = 'otherpage.html'",100);
);

【参考方案3】：

使用这个Reload page

success: function(data)
   if(data.success == true) // if true (1)
      setTimeout(function()// wait for 5 secs(2)
           location.reload(); // then reload the page.(3)
      , 5000); 
   

【讨论】：

无法在现有页面中重新加载

为什么要做if (data.success == true)？

【参考方案4】：

ajax 成功后使用 ajaxSuccess 重新加载页面。

$(document).ajaxSuccess(function()
    window.location.reload();
);