2

私はこのコードを機能させようとしていますが、なぜ機能しないのか一生理解できません。私はJSlintとすべてを試しました。初心者の質問で申し訳ありませんが、私は JavaScript を 2 時間も使っていないので、馬鹿げた問題です。ありがとう。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
     <link rel="stylesheet" type="text/css" href="Style/demo.css" />
   <script type="text/javascript">
       window.onload = init;
function init() {
           document.getElementById("s1").onclick = print(1);
           document.getElementById("s2").onclick = print(2);
           document.getElementById("s3").onclick = print(3);
           document.getElementById("s4").onclick = print(0);
}

       function print(printno) {
       var demo = document.getElementById("demo");

       switch(printno)
       {
       case 1:
       demo.innerHTML=  "It is a period of civil war. Rebel spaceships, striking from a hidden base, have won their first victory against the evil Galactic Empire. ";
        break;
        case 2:
        demo.innerHTML = "During the battle, Rebel spies managed to steal secret plans to the Empire's ultimate weapon, the Death Star, an armored space station with enough power to destroy an entire planet.";
        break;
        case 3:
        demo.innerHTML = "Pursued by the Empire's sinister agents, Princess Leia races home aboard her starship, custodian of the stolen plans that can save her people and restore freedom to the galaxy....";
        break;
        case 0:
        demo.innerHTML = "A long time ago, in a galaxy far, far away..";
        break;
        }
}

   </script>
</head>
<body>
    <div id="demo">
        A long time ago, in a galaxy far, far away..
    </div>
    <ul>
      <li><span id ="s1">Part 1</span></li>
      <li><span id="s2">Part 2</span></li>
      <li><span id="s3">Part 3</span></li>
      <li><span id="s4">Reset</span></li>
</ul>
</body>
</html>
4

1 に答える 1

5

このようなことをすると：

document.getElementById("s1").onclick = print(1);
document.getElementById("s2").onclick = print(2);
document.getElementById("s3").onclick = print(3);
document.getElementById("s4").onclick = print(0);

実際には、指定されたパラメーターで関数を呼び出しprint()、その関数の結果 (実際にはundefined) を onclick イベントに結合します。あなたがやりたかったことは次のようなものだったと思います：

document.getElementById("s1").onclick = function(){ print(1) };
document.getElementById("s2").onclick = function(){ print(2) };
document.getElementById("s3").onclick = function(){ print(3) };
document.getElementById("s4").onclick = function(){ print(0) };

これにより、関数を呼び出す関数がアタッチされますprint()。

于 2013-03-09T07:40:50.483 に答える