-5

我正在学习 javascript，并且我编写了一个简短的骰子应用程序，但是单击按钮时它不会运行。我看不出问题出在哪里。有人可以帮我解决这个问题。

    <!DOCTYPE HTML>
<html>
    <head>
        <script type=text/javascript>

        var face0= new Image() face0.src="d1.gif"
        var face1= new Image() face1.src="d2.gif"
        var face2= new Image() face2.src="d3.gif"
        var face3= new Image() face3.src="d4.gif"
        var face4= new Image() face4.src="d5.gif"
        var face5= new Image() face5.src="d6.gif"

        function rollDice(){
        var randomdice= Math.round(Math.random() *5)document.images["mydice"].src=eval("face" * randomdice+".src")
        }
        </script>
    </head>
    <body>
    <img src="d1.gif" name="mydice">
    <form>
    <input type="button" value="Roll" onclick="rollDice()">
    </form>

    </body>
</html>
4

4 回答 4

2

分号不是可选的。浏览器会尽可能地尝试插入它们，但很多时候它可能是错误的。

此外，使用 @!#$ 数组！这就是他们的目的！

尝试这个：

(function() {
    var i, faces = [];
    for( i=0; i<6; i++) {
        (faces[i] = new Image()).src = "d"+(i+1)+".gif";
    }
    window.rollDice = function() {
        var side = Math.floor(Math.random()*6);
        document.getElementById('mydice').src = faces[side].src;
    }
})();

...

<img src="d1.gif" id="mydice" />

并删除表格。你没有提交任何东西，所以你不需要表格。

于 2012-11-27T14:59:44.443 回答
1

请不要使用eval. 而是做这样的事情：

var faces=[]
var numFaces=6;
for(var i=1;i<=numFaces;i++){
    var img=new Image();
    img.src='d'+i+'.gif';
    faces.push(img);
}
window.rollDice=function(){
    var randomdice= Math.floor(Math.random()*numFaces);
    document.images["mydice"].src=faces[randomdice].src;
}

jsFiddle：http: //jsfiddle.net/jdwire/fZY3u/

于 2012-11-27T15:01:27.227 回答
0

你快到了 - 你只需要semi colons在你的语句之间，你需要用'+'连接字符串，而不是'*'

编辑

正如 Kolink 指出的那样，eval 是危险的。

您实际上根本不需要实例化Image()s - 鉴于骰子的侧面有 6 个 gif，您需要做的就是更改src图像上的文件名，如下所示：

 function rollDice(){
     var randomdice= Math.round(Math.random() *5) + 1; // +1 since your gifs are 1-6
     document.images["mydice"].src = "d" + randomdice.toString() + ".gif";
 }

在这里更新了小提琴

编辑请注意以下几点指出的注意事项，即此答案不会预加载图像，这将在第一次触发每个骰子面 gif 时（在缓存之前）对性能造成影响。

于 2012-11-27T14:59:18.493 回答
-1

你错过了分号;

    var face0= new Image(); face0.src="d1.gif";
    var face1= new Image(); face1.src="d2.gif";
    var face2= new Image(); face2.src="d3.gif";
    var face3= new Image(); face3.src="d4.gif";
    var face4= new Image(); face4.src="d5.gif";
    var face5= new Image(); face5.src="d6.gif";

    function rollDice(){
       var randomdice= Math.round(Math.random() *5); 
       document.images["mydice"].src=eval("face" + randomdice+".src");
    }

注意：始终整齐地格式化您的代码。不要将所有代码写在一行中，这会使您感到困惑。

于 2012-11-27T14:57:21.853 回答