如何使用JavaScript动态创建表单？ [英] How to create a form dynamically using JavaScript?

问题描述

我想使用JavaScript动态地在HTML页面的任何位置创建一个不可见的表单，然后自动提交。

我想创建下面给出的表单：

 < form name ='myForm'method ='post'action ='http：//www.another_page.com/index.htm'> 
< input type ='text'name ='myInput'value ='我输入的值'> 
< input type ='hidden1'value ='隐藏值1'> 
< input type ='hidden2'value ='隐藏值2'> 
< / form> 
  

我尝试使用下面的JavaScript：

  my_form =使用document.createElement（ '形式'）; 
 my_form.name ='myForm'; 
 my_form.method ='POST'; 
 my_form.action ='http：//www.another_page.com/index.htm'; 
 my_tb = document.createElement（'INPUT'）; 
 my_tb.type ='TEXT'; 
 my_tb.name ='myInput'; 
 my_tb.value ='我的输入值'; 
 my_tb.appendChild（my_form）; 
 document.body.add（my_form，document.body.elements [0]）; 
 document.my_form.submit（）; 
  

但是无法正常工作？我怎样才能做到这一点？请帮助。

解决方案

您将表单元素添加为文本框的子元素。

  my_tb.appendChild（my_form）; 
  

应该是

  my_form.appendChild（my_tb）; 
  

另外，我没有看到您要创建隐藏元素的位置，但它是与添加文本框相同。

另一个问题 - 试图将表单引用为document.xxx意味着xxx是的 形成。但无论如何，请尝试

  my_form = document.createElement（'FORM'）; 
 my_form.name ='myForm'; 
 my_form.method ='POST'; 
 my_form.action ='http：//www.another_page.com/index.htm'; 
 
 my_tb = document.createElement（'INPUT'）; 
 my_tb.type ='TEXT'; 
 my_tb.name ='myInput'; 
 my_tb.value ='我的输入值'; 
 my_form.appendChild（my_tb）; 
 
 my_tb = document.createElement（'INPUT'）; 
 my_tb.type ='HIDDEN'; 
 my_tb.name ='hidden1'; 
 my_tb.value ='我的隐藏1的值'; 
 my_form.appendChild（my_tb）; 
 document.body.appendChild（my_form）; 
 my_form.submit（）; 
  

I want to create a invisible form anywhere into a HTML page dynamically using JavaScript and then submit automatically.
I want to create the form given below:

<form name='myForm' method='post' action='http://www.another_page.com/index.htm'>
<input type='text' name='myInput' value='Values of my input'>
<input type='hidden1' value='Hidden value 1'>
<input type='hidden2' value='Hidden value 2'>
</form>

I tried using the JavaScript below:

my_form=document.createElement('FORM');
my_form.name='myForm';
my_form.method='POST';
my_form.action='http://www.another_page.com/index.htm';
my_tb=document.createElement('INPUT');
my_tb.type='TEXT';
my_tb.name='myInput';
my_tb.value='Values of my Input';
my_tb.appendChild(my_form);
document.body.add(my_form,document.body.elements[0]);
document.my_form.submit();

But not working? How can I do that? Please help.

解决方案

You're adding the form element as a child of the text box.

my_tb.appendChild(my_form);

Should be

my_form.appendChild(my_tb);

Also, I don't see where you're trying to create the hidden elements, but it's the same thing as adding a text box.

Another problem - trying to reference the form as document.xxx means that xxx is the name of the form. But anyway, try

my_form=document.createElement('FORM');
my_form.name='myForm';
my_form.method='POST';
my_form.action='http://www.another_page.com/index.htm';

my_tb=document.createElement('INPUT');
my_tb.type='TEXT';
my_tb.name='myInput';
my_tb.value='Values of my Input';
my_form.appendChild(my_tb);

my_tb=document.createElement('INPUT');
my_tb.type='HIDDEN';
my_tb.name='hidden1';
my_tb.value='Values of my hidden1';
my_form.appendChild(my_tb);
document.body.appendChild(my_form);
my_form.submit();

这篇关于如何使用JavaScript动态创建表单？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！