#初学者问个有关问题:动态调整文本框个数#

##################菜鸟问个问题:动态调整文本框个数#####################
用户选择下拉框,分i步完成任务,然后下面立刻给出i个文本框让他输入预计完成日期,
其中1 <=i <=5

请问该怎么用js实现呢?

着实菜鸟,就有点基本js知识,但这个东西程序中用到了,只好请大虾帮忙,然后我在回去好好学习,补上js这一课.

小弟感激不尽.

[解决办法]
<html>
<head>
<script>
function myFun()
{
var ddl = document.getElementById( "sel ");
var txt0 = document.getElementById( "txt0 ");
var txt1 = document.getElementById( "txt1 ");
var txt2 = document.getElementById( "txt2 ");
var txt3 = document.getElementById( "txt3 ");
//
switch ( ddl.options[ddl.selectedIndex].value )
{

case "-1 ":

txt0.style.display = "none ";
txt1.style.display = "none ";
txt2.style.display = "none ";
txt3.style.display = "none ";
case "0 ":
txt0.style.display = " ";
txt1.style.display = "none ";
txt2.style.display = "none ";
txt3.style.display = "none ";

break;
case "1 ":
txt0.style.display = " ";
txt1.style.display = " ";
txt2.style.display = "none ";
txt3.style.display = "none ";
break;
case "2 ":
txt0.style.display = " ";
txt1.style.display = " ";
txt2.style.display = " ";
txt3.style.display = "none ";
break;
case "3 ":
txt0.style.display = " ";
txt1.style.display = " ";
txt2.style.display = " ";
txt3.style.display = " ";
break;

}
}
</script>
</head>
<body>

<select id= "sel " onChange= "myFun(); ">
<option value= "-1 "> 请选步骤 </option>
<option value= "0 "> 第一步 </option>
<option value= "1 "> 第二步 </option>
<option value= "2 "> 第三步 </option>
<option value= "3 "> 第四步 </option>
</select>
<input type= "text " id= "txt0 " style= "display:none ">
<input type= "text " id= "txt1 " style= "display:none ">
<input type= "text " id= "txt2 " style= "display:none ">
<input type= "text " id= "txt3 " style= "display:none ">

</body>
</html>
我做了一个简单的例子，不知道对你有没有帮助
[解决办法]
<script language= "JavaScript ">
function setfocus()
{
document.form1.marking.focus();
}
</script>
<script language= "javascript ">
var j=0
function add_row(){
k=j+1
j=sqd.rows.length;
newRow=document.all.sqd.insertRow(-1)
newcell=newRow.insertCell()
newcell.style.backgroundColor= '#f7f7f7 '
newcell.innerHTML=j
newcell=newRow.insertCell()
newcell.style.backgroundColor= '#f7f7f7 '
newcell.innerHTML= " <input name=Number type=radio > "
newcell=newRow.insertCell()
newcell.style.backgroundColor= '#f7f7f7 '
//*************************update************************************
newcell.innerHTML= " <input name=Marking type=text class=INPUT1 size=30 style=font-size: 20px; font-weight: bold onblur= 'onBlurValue() '> "

//**************************end**************************************
newcell=newRow.insertCell()
newcell.style.backgroundColor= '#f7f7f7 '
newcell.innerHTML= " <input name=price type=text class=INPUT1 size=20 style=font-size: 20px; font-weight: bold> "
}
function del_row() {
if(sqd.rows.length==1) return;
var checkit = false
for (var i=0;i <document.all.Number.length;i++) {
if (document.all.Number[i].checked) {

checkit=true;
sqd.deleteRow(i)
break;
}
}

if (checkit) {

for(i=1;i <sqd.rows.length;i++){
sqd.rows[i].cells[0].innerText=i
}

} else
{
alert( "请选择一个要删除的对象 ");
return false}

}
//******************************update***********************************
function onBlurValue(){
document.all.price.value=1;
alert(document.all.price.value);
}
//***********************************************************************
</script>

<script language= "javascript ">
function check()
{var j=0;
for (i=0;i <document.form1.elements.length;i++){
var strType = document.form1.elements[i].type
if (strType == 'text ')
{
if (document.form1.elements[i].value!= " ")
{
j=j+1;
}
}
}
if (j-1==0)
{
alert( "请输入条码！ ");
document.form1.elements[i].focus();
return false;
}
if ((j-1)%2!=0)
{
alert( "请输入条码！ ");
document.form1.elements[i].focus();
return false;
}
document.form1.submit();
}
</script>
<table width= "100% " border=0 align= "center " cellpadding=2 cellspacing=1 bgcolor= "#FFFFFF ">
<form name= "form1 " action= "sale2.asp " method= "post ">
<tr>
<td height= "25 " align= "center "> <strong> <font size= "5 "> 商品销售单 </font> </strong> </td>
</tr>
<tr>
<td align=center valign=top bgcolor=f7f7f7>
<table id= "sqd " width= "100% " border= "0 " cellpadding= "0 " cellspacing= "1 " bgcolor= "#999999 ">
<tr class= "TRL2 ">
<td height= "25 " width= "6% "> <strong> <font size= "5 "> 序号 </font> </strong> </td>
<td width= "7% "> <strong> <font size= "5 "> 选中
<input name= "Number " type= "hidden " >
</font> </strong> </td>
<td width= "36% "> <strong> <font size= "5 "> 商品条码 </font> </strong> </td>
<td width= "51% "> <strong> <font size= "5 "> 销售数量 </font> </strong> </td>
</tr>
</table>
<br>
<table width= "100% " border= "0 " cellpadding= "0 " cellspacing= "0 " >
<tr>
<td align= "center ">
<input name= "addrow " type= "button " onClick= "add_row(1) " class= "button " value= "添加新行 ">   
<input name= "delrow " onclick= "del_row() " type= "button " class= "button " value= "删除行 ">   

#初学者问个有关问题:动态调整文本框个

热点推荐