- 3/5
- 1
- 2
- 3
- 4
- 5
织梦DedeCMS视频教程买空间 租服务器 选网硕互联！ 无忧站长工具,百度权重一键全查!
比较有意思的两个Select下拉列表框，不能同时选择相同的值，也就是这两个下拉框的内容是一样的，当你选择前一个列表框中的任意值的时候，第二个下拉列表框中与之相对应的值会自动消失，说不定什么时候我们就能用上这功能。
<html> <head> <title>禁止选择相同值的Select下拉列表</title> </head> <script> var OptLstTxt = new Array; var OptLstVal = new Array; var OptLen = 0; function NoDupl(SelObjFrom, SelObjTo) { var OldToVal = SelObjTo.options[SelObjTo.selectedIndex].value; if (OptLen == 0) { OptLen = SelObjFrom.length; for (var i = 1; i < OptLen; i++) { OptLstTxt[i] = SelObjFrom.options[i].text; OptLstVal[i] = SelObjFrom.options[i].value; } } var j = 1; for (var i = 1; i < OptLen; i++) { if (OptLstVal[i] != SelObjFrom.options[SelObjFrom.selectedIndex].value) { if (j == SelObjTo.length) { SelObjTo.options[j] = new Option(OptLstTxt[i]); } else { SelObjTo.options[j].text = OptLstTxt[i]; } SelObjTo.options[j].value = OptLstVal[i]; if (OptLstVal[i] == OldToVal) { SelObjTo.selectedIndex = j; } j++; } } if (SelObjTo.length > j) SelObjTo.options[(SelObjTo.length - 1)] = null; } </script> </head> <body> <form method="POST" name="MForm"> <div align="center">两个下拉框你只能选择不同的值<br> <select name="Color_1" onChange="NoDupl(this,document.MForm.Color_2)"> <option selected value=''>你的WEB编程语言</option> <option value='ASP'>ASP</option> <option value='PHP'>PHP</option> <option value='JSP'>JSP</option> <option value='CGI'>CGI</option> </select> <select name="Color_2" onChange="NoDupl(this,document.MForm.Color_1)"> <option selected value=''>你的WEB编程语言</option> <option value='ASP'>ASP</option> <option value='PHP'>PHP</option> <option value='JSP'>JSP</option> <option value='CGI'>CGI</option> </select> </div> </form> </body> </html>