javascript - 为什么使用 location.reload() 时我的页面没有刷新？

Question

我知道这个问题已经在这里被问过多次，但我想要一些意见。

我正在开发的网络应用程序通过 Freemarker 显示数据库中的表格。它包括一个提交按钮，用于从该数据库中删除条目。该按钮可以很好地发送请求，但我想让它自动刷新页面，以显示没有该条目的新表。我试过这个:

<form onsubmit="location.reload()" method="post" action="http://localhost:8080/person/delete/${profile.id};">
<input type="submit" value="Delete"></form>

还有这个:

<form onsubmit="location.reload()" method="post" action="http://localhost:8080/person/delete/${profile.id};">
<input type="submit" value="Delete"></form>

两者都没有任何影响。进一步的研究表明，reload() 将从缓存中刷新页面，除非将forceGet 设置为true。我对这两种方法都这样做了，没有发现任何区别。然后我认为是页面刷新后才从服务器获取更新信息的情况，所以我让它等待100毫秒:

<script>
    function reloadPage() {
        setTimeout(function () {
            location.reload();
        }, 100)
    }
</script>
<form onsubmit="reloadPage()" method="post" action="http://localhost:8080/person/delete/${profile.id};">
                        <input type="submit" value="Delete"></form>

这是可行的，但我想知道是否有任何关于为什么原始方法不起作用的见解。另外，对于我的代码的替代方案有什么建议吗？

编辑:

澄清一下，路径 http://localhost:8080/person/delete/ ${个人资料.id};不引导至页面；它的意思是调用资源类中将运行删除方法的方法:

@POST
@Path("/delete/{id}")
public void deleteProfile(@PathParam("id") int id) {
    manager.deleteProfile(id);
}

Answer 1

因为 onsubmit 在操作运行之前被调用。流程是这样的:

• 提交表单
• 调用 onSubmit 事件
• 如果事件未被阻止，则运行操作

所以发生的事情是这样的:

• 提交表单
• 重新加载页面

由于您正在重新加载页面，因此永远不会达到操作，从而停止所有页面逻辑。就像关闭一个程序然后再次打开它一样。

你的 100 毫秒是一个肮脏的解决方法，因为尽管它对你有用，但对于无法在 100 毫秒之前处理操作的任何人来说可能不起作用。想象一下一个缓慢的设备、缓慢的网络或缓慢的东西会导致操作延迟超过 100 毫秒。它将在运行操作之前重新加载页面。

我不明白的是为什么你不让网页为你重新加载。自然表单提交会将您带到操作 URL，加载它，因此如果是相同的 URL，则重新加载页面。