我编写了一些 JavaScript 来允许编辑 HTML 表单中的项目列表,包括添加和删除项目。让它在 Firefox 中工作。在 Internet Explorer 中尝试时,我发现任何添加的项目都没有与表单一起提交。
长话短说...大量的简化、调试,找出了触发 IE 忽略新表单输入的行。这样行为问题就解决了。
但现在我必须问:为什么?这是一个IE错误吗?
这是简化的代码:
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function add() {
div = document.getElementById("mylist");
// *** Adding text here works perfectly fine. ***
div.innerHTML += " ";
e = document.createElement("input");
e.setAttribute("type", "text");
e.setAttribute("name", "field3");
e.setAttribute("value", "--NEWVALUE--");
div.appendChild(e);
// *** Adding text here works perfectly fine in Firefox, but for
// Internet Explorer it causes field3 to not be submitted. ***
//div.innerHTML += " ";
}
</script>
</head>
<body>
<form action="" method="get">
<div id="mylist">
<input type="text" name="field1" value="value1" />
<input type="text" name="field2" value="value2" />
</div>
<a href="javascript:" onclick="add()" />Add</a>
<input type="submit" value="Submit" />
</form>
</body>
</html>
要尝试一下,做显而易见的事情:在 IE 中加载,单击添加,单击提交,查看地址栏中的内容。如果你取消最后一行的注释add()
,IE 会突然停止报告field3
。无论哪种方式,它在 Firefox 中都可以正常工作。
有任何想法吗?好奇的心想知道。(如果需要,我将如何以便携的方式在其中添加文本,让 IE 很高兴?)