根据下拉选择更改DIV的内容

Question

在网页上，当从下拉列表中进行特定选择时，div的内容必须动态更改。 下面是我的代码，我不知道我哪里出错了？ 任何帮助，将不胜感激。

<head>
<script type="text/javascript">
function fn()
{
    var x = document.getElementsById("select").selectedIndex;
    var y = document.getElementById("a").innerHTML;

    if (X == "0")
    {
        y = " So.. ur a conman" ;
    }
    else
    {
        y = "oops";
    }
}
window.onload = fn() ;
x.onchange = fn() ;
</script>

<body>
<select name="select" id="select">
<option value="consulting"> Consulting </option>
<option value="industry"> Industry </option>
</select>
<div id="a" style="background-color:blue; width:1200px; height:20px; color:black;">
</div>
</body>
</html>

Answer 1

Javascript区分大小写，因此x与X 。 将X更改为x 。
y接收内部html的值，而不是对内部html的引用。 这意味着您无法通过y更改innerHTML。
分配给window.onload时，您当前正在分配函数的返回值。 你想分配函数本身，所以它应该是window.onload = fn; 。

改进但未经过测试的代码：

<script type="text/javascript">

var x = document.getElementsById("select");
var y = document.getElementById("a");

function fn()
{

    if (x.selectedIndex == 0)
    {
        y.innerHTML = " So.. ur a conman" ;
    }
    else
    {
        y.innerHTML = "oops";
    }
}

window.onload = fn ;
x.onchange = fn ;

</script>

此外，请注意您的浏览器具有开发人员工具，可以告诉您一些错误。 根据您用于测试的浏览器，您可以按F12打开这些工具。 看看那里的控制台，你会看到类似于'X' is not defined消息'X' is not defined 。

根据下拉选择更改DIV的内容

问题描述

1 个解决方案

解决方案1
2 2012-07-05 12:17:13

根据下拉选择更改DIV的内容

问题描述

1 个解决方案

解决方案1 2 2012-07-05 12:17:13

解决方案1
2 2012-07-05 12:17:13