Javascript 动态创建表单

在我的页面上，我显示了一个条目表。在表格的末尾有一个“修改”按钮。单击按钮时，该行将变成一个表单，用于直接修改内容

此代码：

element.innerHTML = "<tr class='alt_col'>";
element.innerHTML += "<form action='/RIDT/includes/modify_codeplug.inc.php' method='POST' name='modify_form'>";
element.innerHTML += "<td><input type='text' name='fileName' value='" + fileName + "'></td>";
element.innerHTML += "<td><input type='text' name='location' value='" + loc + "'></td>";
element.innerHTML += "<td><input type='text' name='build' value='" + build + "'></td>";
element.innerHTML += "<td><input type='text' name='version' value='" + version + "'></td>";
element.innerHTML += "<td><select name='type' id ='selectType'>" + descOptions + "</select></td>";
element.innerHTML += "<td><input type='hidden' name='id' value='" + id + "'/><input type='submit' value='Submit'/></td>";
element.innerHTML += "</form>";
element.innerHTML += "</tr>";

var options = document.getElementById("selectType").options;

for (i = 0; i < options.length; i++)
{
    if (options[i].text == desc)
    {
        options[i].selected=true;
    }
}

element.innerHTML=”“；
element.innerHTML+=“”；
element.innerHTML+=“”；
element.innerHTML+=“”；
element.innerHTML+=“”；
element.innerHTML+=“”；
element.innerHTML+=“”+descOptions+“”；
element.innerHTML+=“”；
element.innerHTML+=“”；
element.innerHTML+=“”；
var options=document.getElementById（“selectType”）.options；
对于（i=0；i

结果将以如下方式创建表单：

<form action="/RIDT/includes/modify_codeplug.inc.php" method="POST" name="modify_form"></form>

---

所有表单输入元素都位于结束元素之后。为什么要提前关闭表单？

我没有测试这一点，但是如果您尝试将未关闭的元素插入DOM中，jQuery也会遇到同样的问题。将为您添加结束标记

请尝试以下方法：

//track the html as a single string var
var html = "<tr class='alt_col'>";
html += "<form action='/RIDT/includes/modify_codeplug.inc.php' method='POST' name='modify_form'>";
html += "<td><input type='text' name='fileName' value='" + fileName + "'></td>";
html += "<td><input type='text' name='location' value='" + loc + "'></td>";
html += "<td><input type='text' name='build' value='" + build + "'></td>";
html += "<td><input type='text' name='version' value='" + version + "'></td>";
html += "<td><select name='type' id ='selectType'>" + descOptions + "</select></td>";
html += "<td><input type='hidden' name='id' value='" + id + "'/><input type='submit' value='Submit'/></td>";
html += "</form>";
html += "</tr>";

// set the html string once
element.innerHTML = html;

//将html作为单个字符串变量跟踪
var html=“”；
html+=“”；
html+=“”；
html+=“”；
html+=“”；
html+=“”；
html+=“”+descOptions+“”；
html+=“”；
html+=“”；
html+=“”；
//设置html字符串一次
element.innerHTML=html；

谢谢大家的帮助。我将在以后更深入地研究提供的所有建议。为了节省时间，我用了另一种方式。submit按钮不是提交表单，而是调用另一个javascript函数，该函数从DOM中提取输入数据，然后构建一个隐藏表单并将其提交到我的php脚本。它并不漂亮，但它完成了任务。

因为不能将表单包装在表数据元素周围。这是无效的HTML，浏览器试图更正它。但是我在另一个页面上做了，它确实有效。这两页上的代码现在看起来完全相同，但问题仍然存在。我将收回这一点。另一个页面有一个“添加新”表单，显示为表行。因此没有细胞数据存在。