小编典典

收到错误“由于表单未连接而取消表单提交”

all

我有一个使用 JQuery 1.7 的旧网站,直到两天前都可以正常工作。突然我的一些按钮不再起作用,单击它们后,我在控制台中收到以下警告:

表单提交因表单未连接而取消

点击背后的代码是这样的:

 this.handleExcelExporter = function(href, cols) {
   var form = $('<form method="post"><input type="submit" /><input type="hidden" name="layout" /></form>').attr('action', href);
   $('input[name="layout"]', form).val(JSON.stringify(cols));
   $('input[type="submit"]', form).click();
 }

Chrome 56 似乎不再支持这种代码了。不是吗?如果是,我的问题是:

  1. 为什么会突然发生这种情况?没有任何弃用警告?
  2. 此代码的解决方法是什么?
  3. 有没有办法在不更改任何代码的情况下强制 chrome(或其他浏览器)像以前一样工作?

PS 它在最新的 Firefox 版本中也不起作用(没有任何消息)。它在 IE 11.0 和 Edge 中也不起作用!(都没有任何消息)


阅读 170

收藏
2022-07-30

共1个答案

小编典典

快速回答:将表格附加到正文中。

document.body.appendChild(form);

或者,如果您使用上面的 jQuery:$(document.body).append(form);

详细信息:根据 HTML 标准,如果表单未关联到浏览上下文(文档),则表单提交将被中止。

HTML规范见 4.10.21.3.2

在 Chrome 56 中,应用了此规范。

Chrome
代码差异
见@@
-347,9 +347,16 @@

PS关于你的问题#1。在我看来,与 ajax 不同,表单提交会导致页面即时移动。
因此,显示“已弃用的警告消息”几乎是不可能的。
我也觉得这个严重的改动不包含在功能改动列表中是不可接受的。Chrome 56 功能 -
www.chromestatus.com/features#milestone%3D56

2022-07-30