JavaScript文本游戏点系统

时间:2015-02-17 20:26:41

标签: javascript html

我是JavaScript的开端,通过我在网上找到的简单项目练习/提高我的JavaScript技能。

这基本上是一个带有四个按钮的文本定位游戏。北,南,东,西。我试图每次玩家一次到新位置时加5分。

我怎样才能这样做,点击按钮后它不会添加点数?

<script type="text/javascript">

var score = 0;

function north(){
    var message = 'You are now in the kitchen';
    alert(message);
    document.getElementById("score").innerHTML = score + 5;
}

function west(){
    var message='You are now the bathroom';
    alert(message);
    document.getElementById("score").innerHTML = score + 10;
}

function east(){
    var message='You are now your bedroom ';
    alert(message);
}

function south(){
    var message='You are now in the living room';
    alert(message);
}


if(document.getElementById('north').clicked == true)
{
    document.getElementById('score') = score + 5;
}

else if(document.getElementById('west').clicked == true){
    document.getElementById('score') = score + 5;
}
</script>

</head>
<body>

<div id='wrap' />

    <header>
        <h1> Exploring New Apartment </h1>
    </header>

    <section>

        <article id='textarea'>
            <textarea  cols='30' rows='5' placeholder='You are currently the living room'></textarea>
            <br />
            <strong> Score: </strong> <p id='score' style="display:inline">0</p>
        </article>

        <article>
            <div>
            <input type='button' value="north" onclick='north()' id='north'/>
            <br />
            <input type='button' value='west' onclick='west()' />
            <input type="button" value='east' onclick='east()'/>
            <br />
            <input type='button' value='south' onclick='south()'/>
        </article>

    </section>

    <footer>
        <p> <a href="mailto:tenkdarko@gmail.com"> Contact Us Via Email </a>
    </footer>


</div>

</body>
</html>

2 个答案:

答案 0 :(得分:0)

我想这可能是因为你没有在函数之外声明得分变量,因此它们可能存储在本地,但我不确定

答案 1 :(得分:0)

为了好玩,我开始了一个更深入的项目,所以我知道这里发生了什么。

首先,你错误地称得分。它是一个javascript变量,因此不要像HTML元素一样调用它,而是将其称为javascript变量。

改变这个:

document.getElementById("score").innerHTML = score + 5;

对此:

score = score + 5;

更简单。但是,您需要添加一个函数来更改#score以随得分变量的变化而变化。对不起,但我的知识太有限了,无法帮助你解决这个问题。

现在,为了仅在未访问过某个地点时添加点,您需要添加一个变量来说明是否已访问某个地点,并为该分数添加if语句。像这样(北方):

var score = 0;
var beenNorth = false;

function north(){
    var message = 'You are now in the kitchen';
    alert(message);
    if (beenNorth == false) {    //If you have not been north, do this:
        score = score + 5;
        }
    beenNorth = true;    //Yes, I have been north
}

显然,您必须为每个房间(N,S,E和W)添加变量。

但像这样只有四个房间的游戏有点无聊。我建议使用基于坐标的系统,变量的开头为:

location = [0,0]

将if语句添加或减去位置[0]或位置[1],模拟坐标平面。