Javascript - 如何使自动选择另一个下拉菜单

时间:2009-12-29 14:07:57

标签: javascript drop-down-menu listfield

  • 这里有两个列表字段菜单。第一 branditem
  • 我想,如果我们 选择brandIBM的{​​{1}} item 也选择IBM
  • 另一方面,如果我们 选择brandHP的{​​{1}} item 也选择HP

如何在javascript中执行此操作。

<select name="brand">
  <option>Please Select</option>
  <option>IBM</option>
  <option>HP</option>
</select>

<select name="item">
  <option>Please Select</option>
  <option>IBM</option>
  <option>HP</option>  
</select>

3 个答案:

答案 0 :(得分:3)

我注意到你的选项相互排列,所以你可以简单地在第二个中反映selectedIndex:

document.getElementById("brand").onchange = function(){
  document.getElementById("item").selectedIndex = this.selectedIndex;
}

答案 1 :(得分:2)

 <select name="brand" id="brand" onchange="document.getElementById('item').value = document.getElementById('brand').value">
   <option>Please Select</option>
   <option>IBM</option>
   <option>HP</option>
 </select>

 <select name="item" id="item">
   <option>Please Select</option>
   <option>IBM</option>
   <option>HP</option>  
 </select>

答案 2 :(得分:1)

您可以在品牌选择元素中添加 onchange 属性。选择品牌后,将调用 selectItem 函数,然后可以选择与 item select元素中的值匹配的项目。此外,我建议您为选择元素提供ID,以便您可以使用document.getElementById(“brand”)。

<select id="brand" name="brand" onchange="selectItem(this.selectedIndex);">
  <option>Please Select</option>
  <option>IBM</option>
  <option>HP</option>
</select>

以下是select元素的DOM引用: http://www.w3schools.com/jsref/dom_obj_select.asp