当前位置: 代码迷 >> JavaScript >> 请教怎样动态添加和减少文本框
  详细解决方案

请教怎样动态添加和减少文本框

热度:428   发布时间:2012-02-08 19:52:21.0
请问怎样动态添加和减少文本框
我想当下拉表选择 "others "的时候添加一个文本框,而选择其它的时候不添加.
当从 "others "改选其它的时候,刚才添加的一个文本框又删除掉,请问一下用javascript写的check()函数写来实现这个功能,谢谢!

<html>
<head>
<title> 无标题文档 </title>
</head>
<script   language= "javascript ">
function   check()
{
..........
}
</script>
<body>
<form   action= "2.jsp "   method= "post "   name= "form1 ">
<select   name= "bamboo "   onchange= "return   check() ">
<option   selected= "selected "   value= "china "> china </option>
<option   value= "english "> english </option>
<option   value= "america "> america </option>
<option   value= "others "> others </option>
</select>

</form>
</body>
</html>

------解决方案--------------------
<html>

<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> 注意 </title>
</head>

<body>
强列建议慎用JKCombox,
请先检查是否可以用以下方案:
<hr/>
1. <br/>
文化程度:
<select onchange= "if(this.value== '其它 ') this.nextSibling.style.display= ' '; else this.nextSibling.style.display= 'none ' ">
<option value= " "> </option> <option value= "小学 "> 小学 </option> <option value= "中学 "> 中学 </option> <option value= "大学 "> 大学 </option> <option value= "其它 "> 其它 </option>
</select> <input style= "display:none ">
<hr/>
2. <br/>
<input type=radio name=etype checked onclick= "if(this.checked) { wenhuachendu1[0].disabled=false;wenhuachendu1[1].disabled=true;} "> 文化程度(常见):
<select id=wenhuachendu1 >
<option value= " "> </option> <option value= "小学 "> 小学 </option> <option value= "中学 "> 中学 </option> <option value= "大学 "> 大学 </option> <option value= "其它 "> 其它 </option>
</select>
<br>
<input type=radio name=etype onclick= "if(this.checked) { wenhuachendu1[0].disabled=true;wenhuachendu1[1].disabled=false;} " > 文化程度(特别):
<input id=wenhuachendu1 disabled >
</body>

</html>

------解决方案--------------------
function check()
{
f = document.form1;
if(f.bamboo.value == "others ")
{
o = document.createElement( "input ");
o.id = "i ";
f.appendChild(o);
}
else
{
if(f.lastChild.id== "i ") f.removeChild(f.lastChild);
}
}
------解决方案--------------------
用DIV层,删除的时候隐藏DIV层
------解决方案--------------------
if(document.all.bamboo.options[3].selected){
document.forms[0].appendChild(document.createElement( " <input type=text name=aa id=bb> "));

}
if(!(document.all.bamboo.options[3].selected)){
with(document.all( "bb "))
document.all.bb.removeNode(true);

}
  相关解决方案