禁止選擇相同值的Select下拉列表_表單按鈕特效

比較有意思的兩個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>

所屬頻道：表單按鈕特效/更新時間：2013-04-18

[收藏][報錯][返回列表]

相關表單按鈕特效：

禁止選擇相同值的Select下拉列表_表單按鈕特效

表單按鈕特效Rss訂閱特效代碼搜索

表單按鈕特效推薦

猜你也喜歡看這些