【HTML】怎么动态生成文本框
日期：2014-05-18 浏览次数：20790 次
【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都行
我想根据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">
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
