Question

我正在开发一款游戏，它有三个骰子立方体，点击按钮后会显示随机面孔。图像是由css图像精灵。如果随机数为1，则将骰子立方体分配给具有其图像精灵的css类。

function diceroll (){

    var randomnumber = Math.floor(Math.random() * (6 - 1 + 1)) + 1;

        switch (randomnumber) {

        case 1:
            document.getElementById("dice1").setAttribute("class", "face1");
            break;
        case 2:
            document.getElementById("dice1").setAttribute("class", "face2");
            break;
        case 3:
            document.getElementById("dice1").setAttribute("class", "face3");
            break;
        case 4:
            document.getElementById("dice1").setAttribute("class", "face4");
            break;
        case 5:
            document.getElementById("dice1").setAttribute("class", "face5");
            break;
        case 6:
            document.getElementById("dice1").setAttribute("class", "face6");
            break;
    }
}

我有一个单独的按钮，当点击它应该运行上面的diceroll函数到三个div与ids dice1，dice2和dice3。

我想用

function gotoloop (){

    for (i = 0; i < 2; i++) {
        // the code that affects dice(n) and n=1 and then diceroll function
        // affects dice1 n+1
    }

}

我研究过，无法找到实现最后评论两行代码的方法。如果我的方法是正确的，请告诉我并帮助我修改代码。

Answer 1

如果我理解你的问题，你需要这样的东西：

function diceroll (diceId){

    var randomnumber = Math.floor(Math.random() * 6) + 1;

    switch (randomnumber) {

        case 1:        document.getElementById(diceId).setAttribute("class", "face1");        break;
        case 2:        document.getElementById(diceId).setAttribute("class", "face2");        break;
        case 3:        document.getElementById(diceId).setAttribute("class", "face3");        break;
        case 4:        document.getElementById(diceId).setAttribute("class", "face4");        break;
        case 5:        document.getElementById(diceId).setAttribute("class", "face5");        break;
        case 6:        document.getElementById(diceId).setAttribute("class", "face6");        break;
    }
}

function gotoloop (){
    // Start loop at i=1 because the first ID is dice1
    for (var i = 1; i <= 3; i++) {
        // the code that affects dice(n) and n=1 and then diceroll function affects dice1
        // n+1
        diceroll("dice" + i);
    }
}

或者按照Marc Baumbach的评论，你可以写：

function diceroll (diceId){

    var randomnumber = Math.floor(Math.random() * 6) + 1;

    document.getElementById(diceId).setAttribute("class", "face" + randomnumber);
}

javascript for循环使用多个对象的函数

1 个答案: