根据选择菜单下拉更改显示内容答案

【问题标题】：Display content based on Select Menu dropdown change根据选择菜单下拉更改显示内容
【发布时间】：2011-10-10 17:51:23
【问题描述】：

当我更改下拉菜单选择时，我目前正在使用以下内容显示输入字段：

<select id="delivery_country" name="d_country" onchange="
 if (this.selectedIndex==14){
  this.form['statesUSA'].style.visibility='visible'
 }else {
  this.form['statesUSA'].style.visibility='hidden'
 };">

但是，这只会更改名为“statesUSA”的输入表单元素。

如果我想显示这个表单元素在里面的div，我该怎么做？

作为记录，我的 HTML 内容如下：

<div id="usa"> <input type="text" id="statesUSA" /> </div>

非常感谢您的任何指点。

【问题讨论】：

标签： javascript html drop-down-menu selection

【解决方案1】：

使用document.getElementById(id)

这个：

<select id="delivery_country" name="d_country" onchange="if (this.selectedIndex==14){document.getElementById('usa').style.visibility='visible'}else {document.getElementById('usa').style.visibility='hidden'};">

【讨论】：

嗯。由于某种原因，这不起作用。我当前在选择菜单上的代码是： if (this.selectedIndex==14){document.getElementById['usa'].style.visibility='visible'}else {document.getElementById['usa'].style.visibility ='隐藏'};
HTML 是：
不要使用 [] 使用括号：() 这里：而不是 ['usa']，使用 ('usa')
@mcgarriers 考虑使用函数并在onchange 上调用它们
@mcgarriers 在 javascript 块中定义一个函数（如 function doThis() { your code here with multile ifs, or maybe case statements }，然后在选择时使用它，如下所示：onchange="doThis()"。如果原始答案解决了您的问题，请点击接受我的回答旁边的 √ :)