Jqueryのスコアを維持し、 "レベル"を進める

私は、動画をクリックしてクリックするたびにポイントを得る簡単なゲームに取り組んでいます。私は、ユーザーがクリックするとスコアが上がるところで働くようなスコアを持っています。私は何を書くべきなのか、ユーザーが "100"というスコアに達すると、次のレベルに移動してイメージのスピードを上げることができます。または、出発点として、少なくとも機能がユーザーが100ポイントに達したことを認識していることがあります。Jqueryのスコアを維持し、 "レベル"を進める

$(document).ready(function() { 
$('#cursor').animate({ 
    top: '500px' 
    , left: '500px' 
}); 
$('img').click(function() { 
    var randomNumber = Math.random(); 
    $('#score').html(function (i, val) { 
     return val * 1 + 10; 

     function levelup() { 
      if (("#score") >= 10) { 
       alert('Level Up'); 
      } 
     } 
    }); 
    $(this).animate({ 
     top: (Math.random() * window.innerHeight - this.height) + 'px' 
     , left: (Math.random() * window.innerWidth - this.width) + 'px' 
    }) 
}) 

function explode() { 
    alert("TIME UP!"); 
} 
setTimeout(explode, 30000);

}）;

これは私がこれまで持っていたものです。これはユーザーがクリックして10ポイントを与えると認識されます。私はゲームを進めるためにjavascriptファイルに戻って話すためにそのスコアを取得する方法を見つけることができません。おかげさまで

EDIT：「

<head> 
    <title>jQuery animation</title> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <script  src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="java.js" type="text/javascript"></script> 
</head> 

<body> 
    <img id="cursor" src="cursor.png" width="100"> 
    <div id="score">0</div> 
</body> 

</html>'

私の問題のいくつかの混乱があるように私は感じます。私はちょうど100ポイントに達したユーザーを認識するためにゲームを取得したい。

出典

2017-03-24 Mike H

JavaScriptファイルを含めることができますか？ファイルがどのようにゲームを進行させ、どのように構造化されているかを調べることができれば役に立ちます。 – MasterBob

[mcve] – zer00ne

@MasterBobを含むHTMLこれはjavascriptファイル全体です。私はそれがスコアが100に達したことを認識するために私はさらにレベルを追加することを開始することができます探しています。 –

あなたは、スコアを追跡するゲーム機能を持つことによって支援されます。これを達成するための一つの方法があります。私はアニメーションの内容を省略しました。余談として

function createGame(onScoreChanged, onLevelChanged) { 
 
    let score = 0; 
 
    const scoreIncrement = 10; 
 
    let level = 1; 
 

 
    const incrementScore =() => { 
 
     score += scoreIncrement; 
 
     onScoreChanged(score); 
 
     if (score >= (level * 100)) { 
 
      onLevelChanged(++level); 
 
     } 
 
    } 
 
    
 
    return { 
 
     incrementScore 
 
    } 
 
} 
 

 
$(document).ready(function() { 
 
    // these functions are used to respond when score/level changes 
 
    const scoreSubscriber = function(newScore) { 
 
     $('#score').html('Score: ' + newScore); 
 
    } 
 

 
    const levelSubscriber = function(newLevel) { 
 
     alert('You reached level ' + newLevel); 
 
    } 
 

 
    // initialise game 
 
    const game = createGame(scoreSubscriber, levelSubscriber); 
 

 
    // add the click handler 
 
    $('#cursor').click(function() { 
 
     game.incrementScore(); 
 
     // do animation stuff 
 
    }) 
 

 
    // start your animations 
 
});

#cursor { 
 
    width: 50px; 
 
    height: 50px; 
 
    background: steelblue; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="score">Score: </div> 
 
<div id="cursor"></div>

、すべてのimg要素であなたのクリックハンドラを置くことは、おそらく賢明ではありませんので、私は代わりにid属性を使用していました。

出典

2017-03-24 01:49:03

Jqueryのスコアを維持し、 "レベル"を進める

答えて

関連する問題