0

私は変数playersTurnを持っていますが、値を変更していないだけで、誰かが理由を教えてくれますか? アラートを使用して、コードが間違っている場所を見つけようとしましたが、コードを複数の方法で記述しましたが、なぜこの変数が更新されないのですか? この変数を除いて、他のすべては正常に機能しています。

    <div class="square p1">1</div>
    <div class="square p1">2</div>
    <div class="square p1">3</div>
    <div class="square p1">4</div>
    <div class="square p1">5</div>
    <div class="square">6</div>
    <div class="square" style="background-color: #ff0000;">7</div>
    <div class="square">8</div>
    <div class="square p2">9</div>
    <div class="square p2">10</div>
    <div class="square p2">11</div>
    <div class="square p2">12</div>
    <div class="square p2">13</div>
    <div class="square p1">14</div>
    <div class="square p1">15</div>
    <div class="square p1">16</div>
    <div class="square p1">17</div>
    <div class="square p1" style="background-color: #8b4513;">18</div>
    <div class="square">19</div>
    <div class="square" style="background-color: #ff0000;">20</div>
    <div class="square">21</div>
    <div class="square p2">22</div>
    <div class="square p2" style="background-color: #8b4513;">23</div>
    <div class="square p2">24</div>
    <div class="square p2">25</div>
    <div class="square p2">26</div>
    <div class="square p1" style="background-color: #008000;">27</div>
    <div class="square p1" style="background-color: #008000;">28</div>
    <div class="square p1">29</div>
    <div class="square p1">30</div>
    <div class="square p1" style="background-color: #8b4513;">31</div>
    <div class="square">32</div>
    <div class="square" style="background-color: #ff0000;">33</div>
    <div class="square">34</div>
    <div class="square p2">35</div>
    <div class="square p2" style="background-color: #8b4513;">36</div>
    <div class="square p2">37</div>
    <div class="square p2" style="background-color: #008000;">38</div>
    <div class="square p2" style="background-color: #008000;">39</div>
    <div class="square p1" style="background-color: #008000;">40</div>
    <div class="square p1" style="background-color: #008000;">41</div>
    <div class="square p1">42</div>
    <div class="square p1">43</div>
    <div class="square p1">44</div>
    <div class="square">45</div>
    <div class="square" style="background-color: #8b4513;">46</div>
    <div class="square">47</div>
    <div class="square p2">48</div>
    <div class="square p2">49</div>
    <div class="square p2">50</div>
    <div class="square p2" style="background-color: #008000;">51</div>
    <div class="square p2" style="background-color: #008000;">52</div>
    <div class="square p1" style="background-color: #008000;">53</div>
    <div class="square p1" style="background-color: #008000;">54</div>
    <div class="square p1">55</div>
    <div class="square p1" style="background-color: #8b4513;">56</div>
    <div class="square p1">57</div>
    <div class="square">58</div>
    <div class="square" style="background-color: #ff0000;">59</div>
    <div class="square">60</div>
    <div class="square p2" style="background-color: #8b4513;">61</div>
    <div class="square p2">62</div>
    <div class="square p2">63</div>
    <div class="square p2" style="background-color: #008000;">64</div>
    <div class="square p2" style="background-color: #008000;">65</div>
    <div class="square p1">66</div>
    <div class="square p1">67</div>
    <div class="square p1">68</div>
    <div class="square p1" style="background-color: #8b4513;">69</div>
    <div class="square p1">70</div>
    <div class="square">71</div>
    <div class="square" style="background-color: #ff0000;">72</div>
    <div class="square">73</div>
    <div class="square p2" style="background-color: #8b4513;">74</div>
    <div class="square p2">75</div>
    <div class="square p2">76</div>
    <div class="square p2">77</div>
    <div class="square p2">78</div>
    <div class="square p1">79</div>
    <div class="square p1">80</div>
    <div class="square p1">81</div>
    <div class="square p1">82</div>
    <div class="square p1">83</div>
    <div class="square">84</div>
    <div class="square" style="background-color: #ff0000;">85</div>
    <div class="square">86</div>
    <div class="square p2">87</div>
    <div class="square p2">88</div>
    <div class="square p2">89</div>
    <div class="square p2">90</div>
    <div class="square p2">91</div>

    <script type="text/javascript">
        var p1Setup = 9;
        var p2Setup = 9;
        var playersTurn = "p1";
        function update() {
            if(playersTurn == "p1") {
                p1PlaceUnits();
            }
            if(playersTurn == "p2") {
                p2PlaceUnits();
            }
        }
        function p1PlaceUnits() {
            $(".p1").click(function() {
                if(p1Setup > 0) {
                    if(!$(this).hasClass('unitPlaced-p1')) {
                        $(this).addClass("unitPlaced-p1");
                        p1Setup--;
                        //alert("Player 2's turn.");
                        playersTurn = "p2";
                        update();
                    }
                }
            });
        }
        function p2PlaceUnits() {
            $(".p2").click(function() {
                if(p2Setup > 0) {
                    if(!$(this).hasClass('unitPlaced-p2')) {
                        $(this).addClass("unitPlaced-p2");
                        p2Setup--;
                        //alert("Player 1's turn.");
                        playersTurn = "p1";
                        update();
                    }
                }
            });
        }
    </script>

コードWar Pitを調べたい場合は、サイトへのリンクを次に示します。

4

2 に答える 2

1

コードは 1 回だけ評価されるため、変数をテストするplayersTurnと、最初は常に true になります。.p1または.p2変数をテストするコードをクリックすると、変数playersTurnは再度評価されません

于 2013-02-20T18:51:47.830 に答える
0

私はあなたの JS を非常に効率的にするように修正しました! 9000以上！！！！！！

var setup = {
    p1: 9,
    p2: 9
}
var playersTurn = "p1";

$('.square').click(function () {
    if (setup[playersTurn] > 0 && !$(this).hasClass('unitPlaced-' + playersTurn) && $(this).hasClass(playersTurn)) {
        $(this).addClass('unitPlaced-' + playersTurn);
        setup[playersTurn]--;
        (playersTurn == "p1") ? playersTurn = "p2" : playersTurn = "p1";
    }
});

ここでは、jsfiddle で確認できます: http://jsfiddle.net/SXjSe/4/

于 2013-02-20T19:45:19.397 に答える