0

私は、六角形のボードを囲むチームベースがある一種のゲームを設計しています。チームベースをクリックすると、そのチームの番になるという考え方です。私は持っている：

    $('.team').click(function(){
        var teamID=$(this).attr('id');
        explore(teamID);
    });

次に、teamID を使用して、クリックされたチームのインデックスを見つけます。これは、チーム名、スコアなどの属性を持つ json ファイルからオブジェクトとして保存されます。

    function explore(index){         // the game portion
        var turn=file[index];        // finds the team's info from json file
        $('.hex').click(function(){  // when a hex is clicked.... play the game
            alert(turn.teamname);       
            // game elements 
    }

これは最初は常に機能しますが、別のチーム ボックスをクリックしてからヘクスをクリックすると、以前にクリックしたボックスの順番であると認識されることがよくあります。デバッグを試みるために、アラート (turn.teamname) を追加しました。別のボックスをクリックすると、常に最初のボックスにアラートが送信され、別のボックスで 2 番目のアラートが送信されます。2 つのアラートが発生する理由がわかりません。したがって、常に「team1」、次に「team1」、「team2」にアラートが送信されます。さらにボックスをクリックすると、すべてのボックスに警告が表示されるまで警告が続きます。さらに、以前に 2 つ以上のボックスをクリックした場合、同じヘックスをクリックし続けても、「team1」と「team2」であるという警告が交互に表示されるようです。

これは私の最初のスタックオーバーフロー投稿なので、意味があることを願っています! ありがとう！

4

2 に答える 2

1

この動作が発生する理由は、イベント ハンドラーを dom 要素に追加しても削除しないためです。ヘクスでのクリックの処理方法を変更する必要があります。http://api.jquery.com/one/を使用して、すべての 16 進数を保持する親要素にイベント ハンドラーを 1 回追加し、イベント ハンドラー内でどの 16 進数がクリックされたかを確認できます。または、イベント リスナーを 1 回ヘクスに追加し、選択したチームがあるかどうかを確認する、より単純なソリューションを試すこともできます。

var turn;
var teamSelected = false;
function explore(index){         // the game portion
    teamSelected = true;
    turn=file[index];        // finds the team's info from json file
}
$('.hex').click(function(){  // when a hex is clicked.... play the game
    if (teamSelected) {
        alert(turn.teamname);       
        // game elements 
        teamSelected = false;
    }
}
于 2013-07-18T19:28:45.393 に答える
0

このような場合は、流星に入ることをお勧めします。リアクティブ プログラミング モデルは、命令型モデルよりもはるかにクリーンです (特に、すぐに複雑になる可能性のあるゲームでは)。

この例は、このフレームワークを使用して非常に迅速に実行できることを示していると思います (質問の例に最も近い)。

飛び込むには、紹介ビデオを見てから、ドキュメントとそれに関する最近の本に進むことをお勧めします.

于 2013-07-19T05:11:26.503 に答える