【HTML】如何动态生成文本框

我想根据3个单选框的选择情况切换显示3组文本框，第一组文本框包括两个文本框一个按钮，其余2组都只是一个文本框一个按钮，最后通过一个按钮提交当前所显示的文本框里填入的数据。我的思路是把3组文本框分别放到3个表单里，然后用单选框的onclick="document.getElementById('1').style.display“来控制表单显示，但是发现这个方法并不能隐藏表单，所以想请问大家，像这种切换显示并提交数据该怎样做？

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

用你的想法是可以实现的,不过开发还是会点DHTML好
表单是隐藏不了的你应该隐藏div,把三个表单放到三个div就行了下面是动态添加按钮,变通下就行了,动态生成别的也一样的方法
  function createButton(){
var btn=document.createElement("<input type='button' value='按钮'/>") ;
document.body.appendChild(btn);
  }
用3个div，控制div的display就好了
用div,span都行<script>
function show(){
    document.getElementById("div1").style.display="none";//不显示
    document.getElementById("div2").style.display="block";//显示
}
</script><div id="div1">
    <form name="form1">
    </form>
</div>
<div id="div2">
    <form name="form2">
    </form>
</div>
我都调试通过了，其他细节你自己写吧<html><head><title></title>
<script language="javascript" type="text/javascript">
function change(){
var r=document.getElementById("radiogroup").children;
for(var i=0;i<r.length;i++){
if(r[i].checked==false)
document.forms[i].style.display="none";
else document.forms[i].style.display="inline";
}
}
</script>
</head><body>
<form action="" method="get" id="1"  style="display:none;">
<label>表单1</label>
<input type="text">
<input type="text">
<input type="button" value="表单1">
</form>
<form action="" method="get" id="2"  style="display:none;">
<label>表单2</label>
<input type="text">
<input type="button" value="表单2">
</form>
<form action="" method="get" id="3"  style="display:none;">
<label>表单3</label>
<input type="text">
<input type="button" value="表单3">
</form>
<div id="radiogroup">
<input type="radio" name="sizes" onclick="change();">
<input type="radio" name="sizes" onclick="change();">
<input type="radio" name="sizes" onclick="change();">
</div></body></html>
上面的有个地写错了，下面的正确，写快了
我都调试通过了，其他细节你自己写吧
<html><head><title></title>
<script language="javascript" type="text/javascript">
function change(){
var r=document.getElementById("radiogroup").children;
for(var i=0;i<r.length;i++){
if(r[i].checked==false)
document.forms[i].style.display="none";
else document.forms[i].style.display="inline";
}
}
</script>
</head><body>
<form action="" method="get" id="1">
<label>表单1</label>
<input type="text">
<input type="text">
<input type="button" value="表单1">
</form>
<form action="" method="get" id="2"  style="display:none;">
<label>表单2</label>
<input type="text">
<input type="button" value="表单2">
</form>
<form action="" method="get" id="3"  style="display:none;">
<label>表单3</label>
<input type="text">
<input type="button" value="表单3">
</form>
<div id="radiogroup">
<input type="radio" name="sizes" onclick="change();">
<input type="radio" name="sizes" onclick="change();">
<input type="radio" name="sizes" onclick="change();">
</div></body></html>
楼上的貌似迫切的需要分啊,这种麻烦的问题也回答的如此仔细真是寒,最近一直看你在csdn晃.你不是和当时的老紫竹一样有其他预谋吧.
谢谢楼上各位，这么说form是能隐藏的呀
老紫竹当时三个月升星是为了做java基础版的版主,你让我问老紫竹什么???我的每一分都是挣来的,没有一分是刷的,说话要讲证据.
另外再说一句表单是隐藏不了的隐藏的是div元素,因为表单中的input在div里面所以被隐藏了input也是可以隐藏的,很多控件都可以隐藏,具体请楼主参考下dhtml手册我资源里面有,或者你百度下也行
三个月就升星？怎么搞
我现在没事做，所以狂搞分，过几天没准就不来了，转战javaeye，
貌似我是调试运行过了才发上去的，哦