从下拉列表中选择一个值时，将其他下拉列表设置为其默认值

Question

我有一个包含7个下拉列表的php表单。 从其中一个中选择一个值时，我希望其他六个如果先前已打开，则返回其默认值。 我认为应该为此使用JavaScript，但现在不编写这种脚本。 我猜每个下拉列表都必须有一个ID，并且当我从7个中的每个选择一个选项时，javascript应该会识别该ID，并将另一个设置为默认值。 我尝试将JavaScript与document.getElementsByName('id')但无法正常工作。

<form id="form1" name="form1" method="post" action="">
 <select name="select" size="1" id="1">
  <option value="0" selected="selected">please select</option>
  <option value="1">blue</option>
  <option value="2">green</option>
  <option value="3">red</option>
 </select>
<br />
 <select name="select2" size="1" id="2">
  <option value="0" selected="selected">please select</option>
  <option value="1">intel</option>
  <option value="2">amd</option>
 </select>
<br />
 <select name="select3" size="1" id="3">
  <option value="0" selected="selected">please select</option>
  <option value="1">fish</option>
  <option value="2">car</option>
  <option value="3">table</option>
 </select>
<br />
 <select name="select4" size="1" id="4">
  <option value="0" selected="selected">please select</option>
  <option value="1">lcd</option>
  <option value="2">led</option>
 </select>
</form>

这是我的表格。 让我们举个例子，我从第二个下拉列表“ intel”中选择一个值。 此后，我从第三个下拉列表中选择一个值“表”。 我需要做的是从第三个下拉列表中进行选择时，第二个返回“请选择”。 想法是，我不希望使用javascript的人一次选择多个下拉列表。 他们应该能够从打开下拉列表的每一个中看到值，但是如果他们打开另一个，则先前必须返回到“请选择”的selected =“ selected”选项。

谢谢。

Answer 1

这是一个开始的想法。 考虑这样的2个下拉列表。

<select id="Numeric">
   <option value="1">1</option>
   <option value="2">2</option>
   <option value="3">3</option>
</select>

<select id="Alphabets">
   <option value="A">A</option>
   <option value="B">B</option>
   <option value="C">C</option>
</select>

基于第一个下拉菜单的值，我选择了第二个下拉菜单

var val = document.getElementById("Numeric").value;
var obj = document.getElementById("Alphabets");


if(val == "1") obj.value = "A"
else if(val == "2") obj.value = "B"
else if(val == "3") obj.value = "C"

切换更好

switch(val)
{
   case("1"):
      obj.value = "A";
   break;

   case("2"):
      obj.value = "B";
   break;

   case("3"):
      obj.value = "C";
   break;
}

这是非常基本的starup想法。 您需要为所需的功能实现良好的逻辑

评论后更新答案

<html>
<head>
    <script type="text/javascript">
     function handleSelect(thisObj){
           var list = document.getElementsByTagName("SELECT")

           for(var i=0; i< list.length; i++)
       {    
          if(list[i] ==thisObj) continue;
          list[i].value = "0";
       } 
     }
    </script>
 </head>
 <body>
      <form id="form1" name="form1" method="post" action="">
           <select name="select" size="1" id="1" onchange="handleSelect(this)">
               <option value="0" selected="selected">please select</option>
               <option value="1">blue</option>
               <option value="2">green</option>
               <option value="3">red</option>
           </select>
    <br />
           <select name="select2" size="1" id="2" onchange="handleSelect(this)">
               <option value="0" selected="selected">please select</option>
               <option value="1">intel</option>
               <option value="2">amd</option>
           </select>
    <br />
           <select name="select3" size="1" id="3" onchange="handleSelect(this)">
               <option value="0" selected="selected">please select</option>
               <option value="1">fish</option>
               <option value="2">car</option>
               <option value="3">table</option>
            </select>
    <br />
            <select name="select4" size="1" id="4" onchange="handleSelect(this)">
                <option value="0" selected="selected">please select</option>
                <option value="1">lcd</option>
                <option value="2">led</option>
            </select>
      </form>
    </body>
 </html>

从下拉列表中选择一个值时，将其他下拉列表设置为其默认值

问题描述

1 个解决方案

解决方案1
0 已采纳 2013-07-03 07:22:27

从下拉列表中选择一个值时，将其他下拉列表设置为其默认值

问题描述

1 个解决方案

解决方案1 0 已采纳 2013-07-03 07:22:27

解决方案1
0 已采纳 2013-07-03 07:22:27