比如表单中有一个表格,表格里有几栏需要用户填写的文本框,然后提交填写信息给cgi,
表格里有下拉框可以选择操作对象,现在希望用户在下拉框里选择好对象后,与该对象相关的旧数据就立刻显示在对应的文本框中。
另外,这些旧数据在本网页上是已有的,只是想在用户选择操作对象后,再实时显示一下,这样方便用户操作。
请问这样的功能该怎么实现?
谢谢
------解决方案--------------------
- HTML code
<script>
function setValue(obj){
document.getElementsByName("optctr_name")[0].value=obj.options[obj.selectedIndex].text;
var trs=document.getElementsByTagName("table")[0].getElementsByTagName("tr");
var curobj;
for(var i=0,len=trs.length;i<len;i++){
curobj=trs[i];
if(curobj.cells[0].innerHTML==obj.options[obj.selectedIndex].text){
document.getElementsByName("optctr_ip")[0].value=curobj.cells[1].innerHTML;
break;
}
}
}
</script>
<table width="80%" class="field" border="0" cellspacing="1" cellpadding="4" align="center" >
<tbody>
<tr>
<td class="bar" width="10%">名称</td>
<td class="bar" width="15%">IP地址</td>
<td class="bar" width="15%">子网掩码</td>
</tr>
<tr>
<td width="10%">dd</td>
<td width="15%">192.168.1.1</td>
<td width="15%"></td>
</tr>
<tr><td width="10%">ff</td>
<td width="15%">192.168.1.2</td>
<td width="15%"></td>
</tr>
<tr><td width="10%">ee</td>
<td width="15%">192.168.1.3</td>
<td width="15%"></td>
</tr>
</table>
<br><br>
//供用户填写后提交的表格
<table width="80%" style="white-space:pre-wrap" class="field" border="0" cellspacing="1" cellpadding="4" align="center">
<tr><td class="bar" colspan="7" align="right">
操作 <select name="optctr_modtype">
<option></option>
<option value="mod">修改</option>
<option value="del">删除</option>
</select>
对象 <select name="optctr_id" onchange="setValue(this)">
<option></option>
<option value="16">dd</option>
<option value="19">ff</option>
<option value="18">ee</option>
</select>
</td></tr>
<tr>
<td width="20%" align="center"><b><font size="2" >名称</font></b></td>
<td width="80%" align="center"><input style="width:300px" type="text" name="optctr_name"></td></tr>
<tr><td width="20%" align="center"><b><font size="2" >IP地址</font></b></td>
<td width="80%" align="center"><input style="width:300px" type="text" name="optctr_ip"></td></tr>
<tr>
<td colspan=7 align="right"><input type="button" class="btn" name="Submit" value="确定" onclick="CheckSubmit()"></td>
</tr>
</tbody>
</table>
</p>
<br>
<br>
<br>
</form>
------解决方案--------------------
<script type='text/javascript' src='/DWR_T7/dwr/interface/user.js'></script>
<script type='text/javascript' src='/DWR_T7/dwr/engine.js'></script>
<script type='text/javascript' src='/DWR_T7/dwr/util.js'></script>