HTML表单提交至新标签页后，如何实现原页面自动刷新？

你的问题根源在于代码执行顺序搞反啦！你原来先调用window.location.reload()，页面刷新后，原来的表单元素和后续的定时器代码都会被销毁，自然触发不了表单提交。而去掉定时器后，页面立即刷新会中断浏览器处理表单提交的请求，导致表单提交失败。

给你调整一下代码顺序，就能解决这个问题：

function view_message(element) {
  // 先确保表单在新标签页提交（如果没设置target的话）
  element.target = "_blank";
  // 先触发表单提交，让浏览器处理这个请求
  element.submit();
  // 延迟一小段时间再刷新原页面，给浏览器足够时间处理提交请求
  setTimeout(function() {
    window.location.reload();
  }, 100);
}

为什么这样有效？ #

1. 先执行element.submit()：浏览器会立即处理表单提交请求，打开新标签页加载提交后的页面，这个请求不会因为原页面后续的刷新被中断。
2. 延迟刷新原页面：给浏览器留出一点时间确认表单提交请求已经发出，避免页面刷新太快导致请求被取消。你可以根据实际情况调整延迟时间（比如50ms到200ms都可以）。

另外，也可以通过监听表单的submit事件来实现，这样逻辑更清晰：

// 假设你的表单有id="myForm"
const form = document.getElementById('myForm');
form.addEventListener('submit', function() {
  setTimeout(function() {
    window.location.reload();
  }, 100);
});

这样只要表单正常提交（确保target="_blank"已设置），提交后就会自动刷新原页面。

内容的提问来源于stack exchange，提问作者Maxime Lalo