使用 Javascript 动态创建 HTML 表单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3297143/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dynamically create a HTML form with Javascript
提问by Odyss3us
how can I go about creating a form with javascript?
我该如何使用 javascript 创建表单？
I have NO idea on how to proceed, I have been googling my face off but there is nothing definitive that can show me how to dynamically create forms with it.
我不知道如何继续，我一直在谷歌上搜索我的脸，但没有什么明确的可以告诉我如何用它动态创建表单。
Thanx in advance!
提前谢谢！
采纳答案by yan.kun
回答by user1451533
You could try something like this:
你可以尝试这样的事情：
The HTML part:
HTML部分：
<html>
<head></head>
<body>
<body>
</html>
The javascript:
javascript：
<script>
//create a form
var f = document.createElement("form");
f.setAttribute('method',"post");
f.setAttribute('action',"submit.php");
//create input element
var i = document.createElement("input");
i.type = "text";
i.name = "user_name";
i.id = "user_name1";
//create a checkbox
var c = document.createElement("input");
c.type = "checkbox";
c.id = "checkbox1";
c.name = "check1";
//create a button
var s = document.createElement("input");
s.type = "submit";
s.value = "Submit";
// add all elements to the form
f.appendChild(i);
f.appendChild(c);
f.appendChild(s);
// add the form inside the body
$("body").append(f); //using jQuery or
document.getElementsByTagName('body')[0].appendChild(f); //pure javascript
</script>
This way you can create as many elements as you want dynamically.
通过这种方式，您可以动态创建任意数量的元素。
回答by Ganesh Babu
回答by IanNorton
Yes, you can create any amount of html including forms by running javascript,
是的，您可以通过运行 javascript 来创建任意数量的 html，包括表单，
Perhaps:`
也许：`
<html>
<body>
<h1>My Form</h1>
<div id="formcontent">
</div>
</body>
</html>
Our javascript might look like:
我们的 javascript 可能看起来像：
var e1 = document.CreateElement("input");
el.type = "text";
el.name = "myformvar";
var cont = document.GetElementById("formcontent")
cont.appendChild(e1);
回答by MuniR
TRY THIS...
尝试这个...
myWin = open("", "displayWindow", "width=800,height=500,status=yes,toolbar=yes,menubar=yes");
myWin.document.open();
myWin.document.write("<html><head><title>V E N U S </title>");
myWin.document.write("<style type='text/css'>.hdr{.......}</style>");
myWin.document.write("</head><body onload='window.print()'>");
myWin.document.write("<div class='hdr'>");
myWin.document.write("what ever you want");
.
.
myWin.document.write("</div>");
myWin.document.write("</body></html>");
myWin.document.close();
that's will create a form with DIV inside it...
这将创建一个包含 DIV 的表单......
回答by Aaron Digulla
Just use the standard DOM API (document.createElement(), see these docs for an example) to create all the elements of the form.
只需使用标准DOM API（ document.createElement()，看到这些文档为例），以创建表单中的所有元素。
回答by Sean Vieira
My recommendation would be to get the underscore.jslibrary and use its templatefunction to create your forms. (If underscore is too large for you, the template function can stand on its own too).
我的建议是获取underscore.js库并使用其template功能来创建表单。（如果下划线对你来说太大了，模板函数也可以独立存在）。
回答by zaynyatyi
use document.writeor if you want more flexibility use jquery
使用document.write或者如果你想要更大的灵活性使用jquery
