如何使用 javascript 获得选择菜单以突出显示 div 标签答案

【问题标题】：How do you get a select menu to highlight the div tag using javascript如何使用 javascript 获得选择菜单以突出显示 div 标签
【发布时间】：2013-11-25 09:35:15
【问题描述】：

我有一个包含城市部分的下拉菜单，我希望每个下拉元素都选择（突出显示）相关的 div 标签。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Cincinnati</title>
</head>

<body>
<div id="wrapper">cincinnati neighborhood's
  <div id="select-box">
  <select name="cincinnati_cities" id="cincinnati_cities" title="cities">
    <option value="clifton">clifton</option>
    <option value="northside">northside</option>
    <option value="mtadams">mt. adams</option>
    <option value="cincinnati">cincinnati</option>
    <option value="newport">newport</option>
  </select>
  <input name="print" type="button" id="print" title="print" value="print">
  </div>
  <div id="clifton"><p>clifton</p></div>
  <div id="northside"><p>northside</p></div>
  <div id="mtadams"><p>mtadams</p></div>
  <div id="cincinnati"><p>cincinnati</p></div>
  <div id="newport"><p>newport</p></div>
</div>
<script></script>
</body>
</html>

任何帮助将不胜感激

【问题讨论】：

标签： javascript html drop-down-menu highlight

【解决方案1】：

在我看来，最好使用一个 div 来写作……你可以试试这样可能对你有帮助……

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Cincinnati</title>
</head>

<body>
<script>
function a(){
    var x=document.getElementById('cincinnati_cities');
    if(x.options[x.selectedIndex].value=='clifton')
    {
        document.getElementById('northside').innerHTML='clifton';
    }
    else if(x.options[x.selectedIndex].value=='northside')
    {
        document.getElementById('northside').innerHTML='northide';
    }
    else if(x.options[x.selectedIndex].value=='mtadams')
    {
        document.getElementById('northside').innerHTML='mt.adams';
    }
    else if(x.options[x.selectedIndex].value=='cincinnati')
    {
        document.getElementById('northside').innerHTML='cincinnati';
    }
    else
    {
        document.getElementById('northside').innerHTML='newport';
    }
}
</script>
<div id="wrapper">cincinnati neighborhood's
  <div id="select-box">
  <select name="cincinnati_cities" id="cincinnati_cities" title="cities">
    <option value="clifton">clifton</option>
    <option value="northside">northside</option>
    <option value="mtadams">mt. adams</option>
    <option value="cincinnati">cincinnati</option>
    <option value="newport">newport</option>
  </select>
  <input name="print" onclick='a()' type="button" id="print" title="print" value="print">
  </div>
  <div id="northside"><p>hi</p></div>
</div>
</body>
</html>

【讨论】：