Question

在我的页面上，我会显示一个条目表。在表的末尾是＆＃34;修改＆＃34;按钮。单击该按钮时，该行将变为直接修改内容的表单。

此代码：

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

正如以下所示创建表单的结果：

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

所有表单输入元素都在closing元素之后。为什么表格会提前关闭？

Answer 1

感谢大家的帮助。我将研究后来提供的所有建议。为了节省时间，我采取了不同的方式。提交按钮不是提交表单，而是调用另一个从DOM中提取输入数据的javascript函数，然后构建并向我的php脚本提交一个隐藏的表单。它并不漂亮，但它完成了工作。

Answer 2

我没有对此进行测试，但如果您尝试将未关闭的元素插入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;

动态创建表单

2 个答案: