Question

我正在尝试制作一个nav栏，当点击时会触发一个功能，该功能将更改右侧的新文本。现在onclick事件似乎没有触发。

HTML

<div id="classOfferingList" class="classOfferingList" align="left">
    <ul>
        <li>    <a onclick="changeInfo(1)">TESTANCHOR1</a>    </li>
        <li>    <a onclick="changeInfo(2)"> TESTANCHOR2</a>    </li>
        <li>    <a onclick="changeInfo(3)">TESTANCHOR3</a>    </li>
        <li>    <a onclick="changeInfo(4)">TESTANCHOR4</a>    </li>
        <li>    <a onclick="changeInfo(5)">TESTANCHOR5</a>    </li>
    </ul>
</div>
<div>
    <p id="classOfferingInfo">EXAMPLE WRITING</p>
</div>

JavaScript

<script language = "Javascript" >
 text1 = "RANDOMTEXT1";
 text2 = "RANDOMTEXT2";
 text3 = "RAMDONTEXT3";
 text4 = "RANDOMTEXT4";
 text5 = "RANODMTEXT5";

 function changeInfo(infoNum) {
     document.getElementById("classOfferingInfo").textContent = window['text' + infoNum];
 }
 </script>

如果这还不足以找出问题，我可以提供更多代码。

Answer 1

工作正常。可能是您忘记在浏览器中启用Javascript。

<强> HTML：

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript"  >
     text1 = "RANDOMTEXT1";
     text2 = "RANDOMTEXT2";
     text3 = "RAMDONTEXT3";
     text4 = "RANDOMTEXT4";
     text5 = "RANODMTEXT5";

     function changeInfo(infoNum) {
         document.getElementById("classOfferingInfo").textContent = window['text' + infoNum];
     }
</script>
</head>
<body>
   <div id="classOfferingList" class="classOfferingList" align="left">
    <ul>
    <li>    <a onclick="changeInfo(1)">TESTANCHOR1</a>    </li>
    <li>    <a onclick="changeInfo(2)"> TESTANCHOR2</a>    </li>
    <li>    <a onclick="changeInfo(3)">TESTANCHOR3</a>    </li>
    <li>    <a onclick="changeInfo(4)">TESTANCHOR4</a>    </li>
    <li>    <a onclick="changeInfo(5)">TESTANCHOR5</a>    </li>
    </ul>
 </div>
<div>
    <p id="classOfferingInfo">EXAMPLE WRITING</p>
</div></body>
</html>

Demo

onclick事件未触发该功能

1 个答案: