1

HTML 元素：

<div style="text-align:center;";">
    <input style="align:center;" type="button" value="Roll" onClick='roll()';>
</div>

JavaScript 片段：

function roll(){
    document.getElementById('test5').innerHTML=roll;
    var roll;
    document.getElementById('test').innerHTML=roll;
    if (!(roll == 1 || roll == 2 || roll == 3)){
        document.getElementById('test1').innerHTML='inLoop';
        roll = 1;
    }
    //irrelavent code

    var dice1=dice[0];
    var dice2=dice[1];
    var dice3=dice[2];
    var dice4=dice[3];
    var dice5=dice[4];
    if (roll>=3){
        score(dice1, dice2, dice3, dice4, dice5);
    }
    roll = storeRoll(roll);
    document.getElementById('test4').innerHTML=roll;
};

function storeRoll(roll){
    ++roll
    document.getElementById('test2').innerHTML='inFunction';
    document.getElementById('test3').innerHTML=roll;
    return roll;
};

我正在尝试使它，如果roll尚未定义，它将设置为1并在函数的末尾添加1到roll. 一旦有3滚动，它就会调用该score函数。在我的反复试验中，似乎roll每次我重新启动函数时变量都会被重置。我在用户单击 HTML 输入按钮时多次执行该功能，因此循环将不起作用。每次单击按钮时，roll变量都会重置。我想知道我的代码中是否有一些东西正在重置变量roll。

4

2 回答 2

2

Your roll variable is scoped to the function roll(). Each time the function is called, the variable is recreated. If you need to retain the value of roll, you need to scope it as global to the function. Suggested reading: What is the scope of variables in JavaScript?

There are many ways you can achieve this. All solutions except the simplest will require you to learn how Javascript works.

var timesRolled = 0;

function roll() {
    timesRolled++;
    document.getElementById('test3').innerHTML = timesRolled;

    var dice1=dice[0];
    var dice2=dice[1];
    var dice3=dice[2];
    var dice4=dice[3];
    var dice5=dice[4];

    if (timesRolled >= 3) {
        score(dice1, dice2, dice3, dice4, dice5);
    }
}

function score(){
    // presumably here you will reset the timesRolled to 0, so that another game may be played
}

I recommend you learn more about Javascript if you intend to program in it seriously.

https://developer.mozilla.org/en/learn/javascript

于 2013-04-22T02:12:34.570 回答
0

Another problem is that your function's name roll is the same as the variable's name, roll.

I suggest doing this: using the "self" object as a prefix to the roll variable. Doing this for situations like yours is better than global variables which cause problems and errors if multiple scripts are loaded (even two versions of the same script). Also, the "self" object is better than the "top" or "window" object (etc.) because there is one "self" object for each frame in the case of multiple documents in an application.

function roll(){
    document.getElementById('test5').innerHTML=self.roll;

/* your variable declaration still leaves "roll" undefined, but just makes it a local variable; so you really don't need this second statement here */
    document.getElementById('test').innerHTML=self.roll;

    if (!(self.roll == 1 || self.roll == 2 || self.roll == 3)){
        document.getElementById('test1').innerHTML='inLoop';
/* this is when self.roll first gets initialized */
        self.roll = 1;
    }

your function continues as before, but all references to the variable roll should be changed to self.roll.

于 2013-04-22T02:27:34.727 回答