我需要一个简单的下拉菜单OnChange / Select in javascript

时间:2016-03-30 23:48:50

标签: javascript html

我需要一些非常简单的帮助。

我在表单上有2个下拉框:

<select name="OfficeLocation" >
   <option value="" ></option>
   <option value="1" selected="selected">New York</option>
   <option value="2" >Los Angeles</option>
   <option value="3" >San Francisco</option>
</select>

<select name="OfficePhone">
   <option value="" ></option>
   <option value="1">(718)555-1212</option>
   <option value="2" >(213)555-1212</option>
   <option value="3" >(415)555-1214</option>
</select>

第二个是&#34;只读&#34; 我需要知道的是如何改变&#34; OfficePhone&#34;的价值?通过更改&#34; OfficeLocation&#34;的值使用简单的JavaScript或JSP命令 感谢

2 个答案:

答案 0 :(得分:0)

您需要OfficeLocation select的事件处理函数和第二个select的id。

<select name="OfficeLocation" onchange="eHandler">
<option value="" ></option>
<option value="1" selected="selected">New York</option>
<option value="2" >Los Angeles</option>
<option value="3" >San Francisco</option>
</select>

<select name="OfficePhone" id="oPhone">
<option value="" ></option>
<option value="1">(718)555-1212</option>
<option value="2" >(213)555-1212</option>
<option value="3" >(415)555-1214</option>
</select>

您必须在脚本中实现事件处理程序,如下所示:

function eHandler(){
  var secondSelect = document.getElementById('oPhone');
  secondSelect.value = //the value you want to be selected
}

答案 1 :(得分:0)

您可以使用以下脚本:

<script>
    menu1 = document.getElementsByName('OfficeLocation')[0];
    menu2 = document.getElementsByName('OfficePhone')[0];
    menu1.onchange = function(){      
      menu2.value = menu1.value;
    }
  </script>

您正在使用onchange事件启动一项功能,使第二个菜单menu2上的值等于第一个菜单menu1的选定值。

在线演示为here

请注意:脚本应放在元素之后。