【HTML】怎么动态生成文本框

2012-01-11

【HTML】如何动态生成文本框我想根据3个单选框的选择情况切换显示3组文本框，第一组文本框包括两个文本框一个

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

[解决办法]
用你的想法是可以实现的,不过开发还是会点DHTML好
表单是隐藏不了的你应该隐藏div,把三个表单放到三个div就行了

下面是动态添加按钮,变通下就行了,动态生成别的也一样的方法
function createButton(){
var btn=document.createElement("<input type='button' value='按钮'/>") ;
document.body.appendChild(btn);
}
[解决办法]
用3个div，控制div的display就好了
[解决办法]
用div,span都行

HTML code

<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晃.你不是和当时的老紫竹一样有其他预谋吧.

热点排行

Java Web开发

【HTML】怎么动态生成文本框