javascript - 使用新的 html5 表单属性在 IE 中序列化失败

Question

出于某种原因，序列化在我尝试序列化的表单上返回一个空字符串。

两种相同的表单，其中一种具有新的 html5 表单属性:

<form id="foo"></form>
<input form="foo" type="text" placeholder="cat" value="cat" name="cat" id="cat" />

<form id="bar">
    <input type="text" placeholder="dog" value="dog" name="dog" id="dog" />
</form>

对这两者运行序列化，其中一个会正确返回，而新的 html5 表单会返回空字符串。

我希望我做了一些愚蠢的事情，因为这对我来说是一个主要问题，因为我无法控制这些表格的编写方式。我使用的这个 CMS 只有 javascript Hook 。

序列化:

console.log($('form#foo').serialize());
console.log($('form#bar').serialize());

这适用于我测试过的所有其他浏览器，但不适用于 ie、8、9、10 或 11!

编辑:我刚刚检查过:http://www.w3schools.com/html/html5_form_attributes.asp ，并且不支持 IE...有人找到了解决此问题的方法吗？

演示:http://jsfiddle.net/875dks8c/5/

Answer 1

使用 jQuery 修复:

而不是对整个表单进行更传统的序列化。根据 jQuery，您可以将各个表单元素序列化。这样，我找到了 input selector 。从那里开始，我所要做的就是使用表单 id 作为选择器的一部分，一切都很好。

$(':input[form="foo"]').serialize();
// returns cat=cat

测试:ie8-11