<html>
<head>
<title>列表输入测试</title>
<script language="javascript">
var selVal="";
var selIdx=-1;
function selArea_Change(idx)
{
var selVal=document.form1.product.options[idx].value;
if(selVal=="Other")
this.control.style.display="inline";
else
{
selIdx=idx;
this.control.style.display="none";
document.form1.inpOther.value=selVal;
}
}
function Run_Option()
{
if(getOption()=="")
{
alert('请先选择操作');
return false;
}
if(getOption()!="add"&&document.form1.inpOther.value=="")
{
alert('还没有选定内容');
return false;
}
var inpValue=document.form1.inpOther.value;
if(getOption()!="remove"&&inpValue=="")
{
alert('还没有输入任何内容');
return false;
}
switch(getOption())
{
case "add":
document.form1.product.add(new Option(inpValue,inpValue));
break;
case "edit":
document.form1.product.options[selIdx].value=inpValue;
document.form1.product.options[selIdx].text=inpValue;
break;
case "remove":
DelOption();
break;
}
}
function DelOption()
{
if(selIdx>0)
document.form1.product.remove(selIdx);
}
function getOption()
{
var Opt="";
for(var i=0;i<document.form1.selOpt.length;i++)
{
if(document.form1.selOpt[i].checked)
Opt=document.form1.selOpt[i].value;
}
return Opt;
}
</script>
</head>
<body>
<form name="form1" >
<td ><strong>Product Name:</strong>
<select name="product" size="1" onClick="selArea_Change(this.selectedIndex);" onChange="selArea_Change(this.selectedIndex);">
<option value="Other" >其它</option>
</select><br>
<div id="control" style="display:none" >
<input type="text" name="inpOther" value="Please enter here"><br>
<input type="radio" name="selOpt" value="add" >将输入的内容添加到列表框<br>
<input type="radio" name="selOpt" value="remove" >删除选定的内容<br>
<input type="radio" name="selOpt" value="edit" >修改选定的内容<br>
<input type="button" value="确定" onClick="Run_Option();"
>
</div>
</form>
</body>
</html>
