根據下拉選擇更改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