Question

我写这段代码来制作基本游戏。完整的HTML是：

<!DOCTYPE>
<html>
    <head>
        <title>The dodge game</title>
        <link rel="stylesheet" type="text/css" href="normalize.css">
        <link rel="stylesheet" type="text/css" href="index.css">
        <script src="jquery.js"></script>
        <script src="script.js"></script>
    </head>
    <body>
        <div id="play-ground">
        <div id="character"></div>
        <div id="chaser"></div>
        </div>
        <button id="control-up" class="button">UP</button>
        <button id="control-down" class="button">DOWN</button>
        <button id="control-right" class="button">RIGHT</button>
        <button id="control-left" class="button">LEFT</button>
    </body>
</html>

脚本：

$(document).ready (
    function() {
        var characterPositionLeft = 0;
        var characterPositionTop = 0;
        var chaserPositionLeft = 810;
        var chaserPositionTop = 630;
        var speed = 30;
        var dspeed = 60;
        var apoint = 5;
        var testPositionLeft = function() {
            if (chaserPositionLeft > characterPositionLeft) {
                chaserPositionLeft -= 30;
                var caLeft = chaserPositionLeft + 'px';
                $('#chaser').css('margin-left', caLeft);
                leftRight();
                topBottom();
                testEndGame();
                console.log(chaserPositionLeft);
            } else if (chaserPositionLeft < characterPositionLeft) {
                chaserPositionLeft += 30;
                var caLeft = chaserPositionLeft + 'px';
                $('#chaser').css('margin-left', caLeft);
                leftRight();
                topBottom();
                testEndGame();
                console.log(characterPositionLeft);
            }
        }
        var testPositionTop = function() {
            if (chaserPositionTop > characterPositionTop) {
                chaserPositionTop -= 30;
                var caTop = chaserPositionTop + 'px';
                $('#chaser').css('margin-top', caTop);
                leftRight();
                topBottom();
                testEndGame();
                console.log(chaserPositionTop);
            } else if (chaserPositionTop < characterPositionTop) {
                chaserPositionTop += 30;
                var caTop = chaserPositionTop + 'px';
                $('#chaser').css('margin-top', caTop);
                leftRight();
                topBottom();
                testEndGame();
                console.log(chaserPositionTop);
            }
        }
        // left and right
        var CacLeftPlus = chaserPositionLeft + 30;
        var CacLeftMinus = chaserPositionLeft - 30;
        var LeftCaught = false;
        // top and bottom
        var CacTopPlus = chaserPositionTop + 30;
        var CacTopMinus = chaserPositionTop - 30;
        var TopCaught = false;
        // up
        $('#control-up').click ( 
            function() {
                testPositionTop();
                if(characterPositionTop > 0) { 
                characterPositionTop -= speed;
                var cTop = characterPositionTop + 'px';
                console.log(characterPositionTop);
                $('#character').css('margin-top', cTop);
                leftRight();
                topBottom();
                testEndGame();
                } else {
                    console.log('warning: [reached sky limit]');
                }
            }
        )
        // down
        $('#control-down').click ( 
            function() {
                testPositionTop();
                if(characterPositionTop < 630) { 
                characterPositionTop += speed;
                var cTop = characterPositionTop + 'px';
                console.log(characterPositionTop);
                $('#character').css('margin-top', cTop);
                leftRight();
                topBottom();
                testEndGame();
                } else {
                    console.log('warning: [reached earth limit]');
                }
            }
        )
        // right 
        $('#control-right').click ( 
            function() {
                testPositionLeft();
                if(characterPositionLeft < 810) { 
                characterPositionLeft += speed;
                var cTop = characterPositionLeft + 'px';
                console.log(characterPositionLeft);
                $('#character').css('margin-left', cTop);
                leftRight();
                topBottom();
                testEndGame();
                } else {
                    console.log('warning: [reached right limit]');
                }
            }
        )
        // left
        $('#control-left').click ( 
            function() {
                testPositionLeft();
                if(characterPositionLeft > 0) { 
                characterPositionLeft -= speed;
                var cTop = characterPositionLeft + 'px';
                console.log(characterPositionLeft);
                $('#character').css('margin-left', cTop);
                leftRight();
                topBottom();
                testEndGame();
                } else {
                    console.log('warning: [reached left limit]');
                }
            }
        )
        var leftRight = function() {
            if(characterPositionLeft == CacLeftPlus || characterPositionLeft == CacLeftMinus) {
                LeftCaught = true;
                console.log('worked?');
            } else {

            }
        }
        var topBottom = function() {
            if(characterPositionTop == CacTopPlus || characterPositionLeft == CacTopMinus) {
                TopCaught = true;
                console.log('worked?');
            } else {

            }
        }
        var testEndGame = function () {
            if (LeftCaught == true && TopCaught == true) {
            console.log('game over');
            alert('game over');
        } else {

        }
        }
    }
)

一切正常，直到函数leftRight，upBottom和testEndGame。当控制台记录600和630时，他们只有控制台工作。任何人都可以告诉我这个代码中的缺陷和解决这个问题的方法吗？以下是完整代码：http://jsfiddle.net/StK7r/1/

Answer 1

我相信你想要

if(characterPositionTop == CacTopPlus || characterPositionLeft == CacTopMinus) {

代替测试

if(characterPositionTop <= CacTopPlus && characterPositionTop >= CacTopMinus) {

因为你想让你的角色陷入一个盒子里。左边相同。此外，您正在测试“左”的“顶部”位置。

稍后编辑：

我稍微更新了小提琴。我也注意到了这一点：

     // left and right
    var CacLeftPlus = chaserPositionLeft + 30;
    var CacLeftMinus = chaserPositionLeft - 30;
    var LeftCaught = false;
    // top and bottom
    var CacTopPlus = chaserPositionTop + 30;
    var CacTopMinus = chaserPositionTop - 30;

当chaserPositionTop / Left更改时，您不会更新这些变量。它们在这里被价值所束缚，所以显然它们永远保持在初始化器中给予它们的价值。

js只在某个时间执行？

1 个答案: