我的功能没有触发。我想念什么？

Question

Can someone tell me what the problem is with my functions in the Javascript code? 有人可以告诉我JavaScript代码中的函数出了什么问题吗？ I'm making a game with a squirrel, a nut, and a fence. 我正在用松鼠，坚果和栅栏做游戏。 When the squirrel hits the fence I want alert("GAME OVER") to trigger and when the squirrel hits the nut I want alert("VICTORY") to trigger. 当松鼠击中栅栏时，我要触发alert("GAME OVER") ，当松鼠击中螺母时，我要触发alert("VICTORY") 。 I don't have any errors in my console so I assume I am missing something in my function. 我的控制台没有任何错误，因此我假设我的功能中缺少任何内容。 My question is: What have I done wrong in my functions? 我的问题是：我在功能上做错了什么？

<!DOCTYPE html>
<html>
<head>
<title>squirrel</title> 
<script
src="https://code.jquery.com/jquery-3.1.1.min.js"
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
crossorigin="anonymous"></script>
<script type="text/javascript" src="game.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">

<script> function myFunction() {
alert("GAME OVER");
}

</script>

</head>

<body>
 <div class="container"> </div>
<div class="bild"></div>
<img src="http://www.clipartlord.com/wp- 

content/uploads/2014/10/squirrel4.png"    id="squirrel">
<div class="nut"></div>
 <img src="http://www.free-icons-download.net/images/acorn-icon-67589.png"
  id="nut">

 <div class="obstacle"></div>
 <img src="http://www.clipartkid.com/images/202/garden-fence-clipart-  this-
  nice-broken-fence-clip-1m1qK1-clipart.png" id="fence">



 <button id="timer" onclick="myVar = setTimeout(myFunction, 30000)"> Start 
  game</button>

 </body>   
 </html>

Javascript: Javascript：

var squirrel = {};

squirrel.x = 1200;
squirrel.y = -390;

$(document).on('keydown', handletyping);

function handletyping(event) {
  switch (event.which) {
    case 39:
      $('#squirrel').css({
        'left': (squirrel.x += 10) + 'px'
      });
      break;

    case 40:
      $('#squirrel').css({
        'top': (squirrel.y += 10) + 'px'
      });
      break;

    case 37:
      $('#squirrel').css({
        'left': (squirrel.x -= 10) + 'px'
      });
      break;

    case 38:
      $('#squirrel').css({
        'top': (squirrel.y -= 10) + 'px'
      });
      break;

  }
}



function contact() {
  if (squirrel.x >= nut.x && squirrel.x - squirrel.width <= nut.x + nut.width) {
    alert("VICTORY");
  }
  if (squirrel.y >= nut.y && squirrel.y - squirrel.width <= nut.y + nut.width) {
    alert("VICTORY");
  }
  document.getElementById("squirrel").style.left = x + "px";
  document.getElementById("squirrel").style.top = y + "px";
}

function loss() {
  if (squirrel.x >= fence.x && squirrel.x - squirrel.width <= fence.x + fence.width) {
    alert("GAME OVER");
  }
  if (squirrel.y >= fence.y && squirrel.y - squirrel.width <= fence.y + fence.width) {
    alert("GAME OVER");
  }
  document.getElementById("squirrel").style.left = x + "px";
  document.getElementById("squirrel").style.top = y + "px";
}

CSS: CSS：

.bild {
  background-color: green;
  border: 2px solid black;
  height: 400px;
  width: 600px;
  margin: 0 auto;
  border-radius: 50px;
  overflow: hidden;
}
#squirrel {
  width: 35px;
  height: 30px;
  position: relative;
  left: 1200px;
  top: -390px;
}
#nut {
  width: 40px;
  height: 30px;
  position: absolute;
  left: 670px;
  top: 360px;
}
#fence {
  width: 500px;
  height: 30px;
  position: absolute;
  left: 700px;
  top: 320px;
}
#timer {
  position: absolute;
  left: 500px;
  top: 200px;
}

Answer 1

I believe you have your signs flipped should be (and like wise for the other alert) 我相信您的手势应该翻转（对于其他警报，也同样明智）

function loss() {
  if (squirrel.x <= fence.x && squirrel.x - squirrel.width >= fence.x + fence.width) {
    alert("GAME OVER");
  }
  if (squirrel.y <= fence.y && squirrel.y - squirrel.width >= fence.y + fence.width) {
    alert("GAME OVER");
  }

Answer 2

<button id="timer" onclick="myVar = setTimeout(myFunction, 30000)"> Start 
 game</button>

<script>
 $(document).ready(function(){
    $("#timer").click(function(){ alert("Game Over"); }
});
</script>

You can also use jquery. 您也可以使用jquery。

我的功能没有触发。我想念什么？

问题描述

2 个解决方案

解决方案1
0 2016-12-30 17:43:03

解决方案2
-1 2016-12-29 20:25:37

我的功能没有触发。 我想念什么？

问题描述

2 个解决方案

解决方案1 0 2016-12-30 17:43:03

解决方案2 -1 2016-12-29 20:25:37

我的功能没有触发。我想念什么？

解决方案1
0 2016-12-30 17:43:03

解决方案2
-1 2016-12-29 20:25:37