使用JavaScript创建表单

时间:2014-04-29 18:08:13

标签: javascript

对JS来说还是很新的,而不是100%确定我在做什么

我想使用java脚本创建一个带有输入表单的新窗口。

我能够获得一个基本窗口并使用单个选项下拉,但我正在努力如何使表单正常工作。

var i, l, options = [{
   value: 'fName',
   text: 'First Name:'
},
{
   value:'lName',
   text:'Last Name:'
},

{
   value: 'age',
   text: 'Age:'
},
{
   value:'city:',
   text:'City:'
},
{
   value:'state',
   text:'State:'
},

{
   value:'zCode',
   text:'Zip Code:'
}
                    ],

newWindow = window.open("", null, "height=200,width=400,status=yes,toolbar=no,menubar=no,location=no");  

newWindow.document.write("<select onchange='window.opener.setValue(this.value);'>");
for(i=0,l=options.length; i<l; i++) {
    newWindow.document.write("<option value='"+options[i].value+"'>");  
    newWindow.document.write(options[i].text);  
    newWindow.document.write("</option>");
}

newWindow.document.write("</select>");
newWindow.document.title = "Info Window";

这很好但我似乎无法弄清楚如何将其转换为表单构造。非常感谢任何帮助。

1 个答案:

答案 0 :(得分:1)

您应该使用DOM元素对象而不是构建原始HTML。可以将表单添加到新窗口中,如下所示:

// create a form and set properties
var form = document.createElement('form');
form.action = 'http://google.com';
form.method = 'post';

// insert into the body of the new window
newWindow.document.body.appendChild(form);

// add text before the input
var p = document.createElement('p');
form.appendChild(document.createTextNode('Enter text:'));

// add a text input
var input = document.createElement('input');
input.type = 'text';
input.name = 'test';
input.value = 'this is an input';
form.appendChild(input);