获取错误“表单提交已取消，因为表单未连接” [英] Getting Error "Form submission canceled because the form is not connected"

问题描述

我有一个使用JQuery 1.7的旧网站，它在两天前正常运行。突然我的一些按钮不再工作了，点击它们后，我在控制台中得到这个警告：

表单提交被取消，因为表单不相关

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

  this.handleExcelExporter = function（href，cols）{
 var form = $（'< form method =post>< input type =submit />< input type =hiddenname =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&边缘！ （都没有任何消息）

解决方案

快速回答：将表单附加到正文。

$ p code> document.body.appendChild（form）;

或者，如果您正在使用jQuery如上： $（document.body）.append（form）;

详细信息：
根据HTML标准，如果表单不与浏览上下文（文档）相关联，则表单提交将被中止。

HTML SPEC 见4.10.21.3.2

在Chrome 56中，应用了这个规范。

Chrome代码差异请参阅@@ -347,9 +347 ，16 @@

关于你的问题＃1。在我看来，与ajax不同，表单提交会导致即时页面移动。

因此，显示'不推荐使用的警告消息'几乎是不可能的。

我也认为这种严重改变是不可接受的未包括在功能更改列表中。 Chrome 56功能 - www.chromestatus.com/features#milestone%3D56

I have an old website with JQuery 1.7 which works correctly till two days ago. Suddenly some of my buttons do not work anymore and, after clicking on them, I get this warning in the console:

Form submission canceled because the form is not connected

The code behind the click is something like this:

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

It seems that Chrome 56 doesn't support this kind of code anymore. Isn't it? If yes my question is:

1. Why did this happened suddenly? Without any deprecation warning?
2. What is the workaround for this code?
3. Is there a way to force chrome (or other browsers) to work like before without changing any code?

P.S. It doesn't work in the latest firefox version either (without any message). Also it does not work in IE 11.0 & Edge! (both without any message)

解决方案

Quick answer : append the form to the body.

document.body.appendChild(form);

Or, if you're using jQuery as above: $(document.body).append(form);

Details : According to the HTML standards, if the form is not associated to the browsing context(document), the form submission will be aborted.

HTML SPEC see 4.10.21.3.2

In Chrome 56, this spec was applied.

Chrome code diff see @@ -347,9 +347,16 @@

P.S about your question #1. In my opinion, unlike ajax, form submission causes instant page move.
So, showing 'deprecated warning message' is almost impossible.
I also think it's unacceptable that this serious change is not included in the feature change list. Chrome 56 features - www.chromestatus.com/features#milestone%3D56

这篇关于获取错误“表单提交已取消，因为表单未连接”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！