JS/JQ Whack-A-Mole Game



大家好,我正在尝试制作一个JS/JQ游戏:Whack A Mole。

我制作了一个"世界",其中有 6 个div 可以改变颜色(以显示痣的位置(,我还有三个按钮可以选择简单、正常或困难。

我被困在两件事上:1:按钮.click对任何事情都没有反应(甚至没有在p上最简单的css更改(2:div不会改变颜色(这可能是问题1的后续问题(

这是我的代码:

ID 为"car"和文本"blablacar"的 p 表示显示"简单"单击命令以更改颜色。

任何人都可以看到我的代码有什么问题(可能很多,但只是按钮部分(吗?感谢您阅读我的帖子

enter code here

<body>
    <script type="text/javascript" src="../jquery-3.1.1.js">
    "use strict";
        var currentScore = 0;
        var niveau = 0;
        var currentLives = 3;
        var inAction = false;
        var moleworld = "#moleWorld";
        var field = ".field";
        var beginEasyClick = document.getElementById("beginEasyClick");
        var beginnNormalClick = document.getElementById("beginNormalClick");
        var beginHardClick = document.getElementById("beginHardClick");
        var displayScore = document.getElementById("_displayScore");
        var $field = $(moleworld).find(field);

        var getrandomInt(function(min , max)
                         {return Math.floor(Math.random() * (max - min - 1 )) + min}
        function randomField() {
$($field[getrandomInt(0 , 8)]);


            function showmole()
            {
                $(beginEasyClick).click(function{
                $("#car").css("color" , "blue");
            })};
    </script>
<p id="car">blablacar</p>
<div id="StartMenu"></div>
 <button id="beginEasyClick"> Easy </button>
    <button id="beginNormalClick"> Normal </button>
    <button id="beginHardClick"> Hard </button>
<div id="generalInformation">
<p id="_displayScore"> </p> </div>
<div id="moleWorld">
  <div class="field"> </div> 
     <div class="field"> </div> 
     <div class="field"> </div> 
     <div class="field"> </div> 
     <div class="field"> </div> 
     <div class="field"> </div> 
    <div class="field"> </div> 
    <div class="field"> </div> 
    </div>
</body>

除了一些括号错误(即使是无参数函数也需要有空的 (( 括号(,按钮的click()事件处理程序是在 showmole() 函数内部定义的,该函数不会在任何地方调用。您必须将此部分移动到脚本的$().ready()部分,以便在加载文档后立即添加处理程序。

$().ready(function() {
  $(beginEasyClick).click(function () {
    $("#car").css("color", "blue");
  });
});

正如评论中提到的,你以后也应该在jsfiddle上发布你的代码,以便其他人可以更容易地帮助你。这是带有工作"简单"按钮的代码的小提琴。

最新更新