1

我有一个简单的游戏,其中图像随机移动,当用户点击它时分数会增加。

第一个图像在游戏开始之前显示,当点击它时会调用 javascript 中的 play() 函数,该函数会隐藏该图像并显示将用于游戏的图像。

这就是我的代码卡住的地方,它没有调用函数 play()。我是 javascript 和 html 的新手。任何帮助都会很棒!

这是我的代码

<html> 
   <head> 
      <title>Image click Game!</title> 
      <script>
         global var score = 0;
         global var left=400;
         global var top = 100;

         function play() {

            var game = document.getElementById('game');
            var firstDiv = document.getElementById('firstDiv');
            var height = window.innerHeight;
            var width = window.innerWidth;

            firstDiv.style = 'display : none';
            game.style='display : block';

            setInterval("move()", 1000);
        }

        function move() {
           var randomNumberX = Math.floor(Math.random()*11)-5;
           var randomNumberY = Math.floor(Math.random()*11)-5;

           left = left + randomNumberX;
           top = top+randomNumberY;

           var im = document.getElementById('image');
           im.style.left = left;
           im.style.top = top;
       }

       </script> 
    </head> 
 <body> 

    <div id ="firstDiv" style="display : block">
        <img src="pics/playgame.gif" width="108" height="106" onClick = "play()"/></a>
    </div>

        <div id="game" style="display : none">
            <p>"Score: " + score</p>
            <img id="image" src="pics/gameImage.gif"  onClick = "score++" style="position:absolute; left: 400; top: 100;"/></a>
        </div>

  </body> 
</html>
4

2 回答 2

2

您的代码有一些问题:

1) 您的<img>标签以一个杂散的、不需要的</a>标签结尾。

2)在您的<img>标签中,您应该更改为onClick = "play();"

3) 我不相信 javascriptglobal以这种方式支持关键字。

4) 要更改 CSS 样式,请尝试以下操作:

firstDiv.style.display = 'none';
game.style.display = 'block';

5) 你不能以这种方式显示 javascript 变量:<p>"Score: " + score</p>......更不用说没有声明的变量'score'开始了!

继续努力,只有通过练习才能变得更好。

于 2013-07-01T05:13:47.627 回答
0

提尔这个

<script> 

var score = 0;
var left=400;
var top = 100;

function play() {
  var game = document.getElementById('game');
  var firstDiv = document.getElementById('firstDiv');
  var height = window.innerHeight;
  var width = window.innerWidth;
  firstDiv.style.display='none';
  game.style.display='block';
  setInterval("move()", 1000);

}

function move() {
  var randomNumberX=Math.floor(Math.random()*11)-5;
  var randomNumberY=Math.floor(Math.random()*11)-5;
  left= left+randomNumberX;
  top = top+randomNumberY;
  var im= document.getElementById('image');
  im.style.left=left;
  im.style.top=top;

}

于 2013-07-01T04:52:13.060 回答