按下按钮并随机更改图像

debugcn 发表于 Dev

阿尔贝托32

我是这个网站的新手，但我已经关注了很多年。

在此测试中，我尝试按按钮更改图像。图像将随机生成。简而言之，我有2个骰子和1个按钮来更改它们。在这里，代码。

HTML：

 <tr align="center">
<td width="20%"> 
<input type="button" name="tira" value="Tira" onClick="lancio()"> 
<td><img id="scelta1" alt="alt1" width="30px"></img> 
<td id="scelta2">
<img src="images/dado2.gif" alt="2" width="30px"></img>

这是我的JavaScript。

<script>
var scelta1;
var temp=0;

var image = new Array(6);
image[0]= 'images/dado1.gif';
image[1]= 'images/dado2.gif';
image[2]= 'images/dado3.gif';
image[3]= 'images/dado4.gif';
image[4]= 'images/dado5.gif';
image[5]= 'images/dado6.gif';

function lancio(){
    temp = Math.floor((Math.random() * 6));

        if(temp == 0){
            document.getElementById("scelta1").src = image[0];
            document.getElementById("alt1").value = temp;
            return scelta1;
        }
        else if(temp == 1){
            document.getElementById("scelta1").src = image[1];
            document.getElementById("alt1").value = temp;
            return scelta1;
        }
        else if(temp == 2){
            document.getElementById("scelta1").src = image[2];
            document.getElementById("alt1").value = temp;
            return scelta1;
        }
        else if(temp == 3){
            document.getElementById("scelta1").src = image[3];
            document.getElementById("alt1").value = temp;
            return scelta1;
        }
        else if(temp == 4){
            document.getElementById("scelta1").src = image[4];
            document.getElementById("alt1").value = temp;
            return scelta1;
        }
        else if(temp == 5){
            document.getElementById("scelta1").src = image[5];
            document.getElementById("alt1").value = temp;
            return scelta1;
        }

    }
}

</script>

感谢您的支持，希望有很多答案。抱歉，如果我对论坛的规则有误。

再见

阿尔贝托32

@Nikola：感谢您不知道的标签。语法也许很好，但是当我尝试单击按钮时，图像不会改变。

<!--DOCTYPE HTML W3C-->
<html>
    <head>
        <title>Prova</title>

        <script type="text/javascript" src="js/lanciodadi.js">
        </script>
        <link href="stile.css" rel="stylesheet" type="text/css">
    </head>
    <body link="#7FFFD4">
        <div style="color: white"><a href="javascript: void{0}">Login</a> <span>/</span><a href="javascript: void{0}">Registrati</a></div>
        <p align="center"><img src="images/logo.gif" alt="logo" width="30%"></p>
        <table>
            <th colspan="3" style="color: red"><b>Statistiche PARTITA 1</b>
            <tr><td width="20%"> Nome <td><input type="text" name="g1" value="Giocatore 1" style="text-align: center" width="40%"><td><input type="text" name="g2" value="Giocatore 2" style="text-align: center" width="40%">
            <tr><td width="20%"> Soldi <td><input type="text" name="soldi1" value="1000" style="text-align: center" width="40%"><td><input type="text" name="soldi2" value="1000" style="text-align: center" width="40%">
            <tr><td width="20%"> Info <td><textarea rows="3"></textarea><td><textarea rows="3"></textarea>
            <!-- QUA I DADI DEVONO CAMBIARE -->
            <tr align="center"><td width="20%"> <input type="button" name="tira" value="Tira" onClick="lancio();"> <td><img src="images/dado1.gif" id="scelta1" alt="alt1" width="30px"> <td id="scelta2"><img src="images/dado2.gif" alt="2" width="30px">
        </table>
    </body>
</html>

lanciodadi.js

function lancio(){  
        var temp=0;
        var image = new Array(6);
        image[0]= 'images/dado1.gif';
        image[1]= 'images/dado2.gif';
        image[2]= 'images/dado3.gif';
        image[3]= 'images/dado4.gif';
        image[4]= 'images/dado5.gif';
        image[5]= 'images/dado6.gif';

        temp = Math.floor((Math.random() * 6));

        document.getElementById("scelta1").src = image[temp];


    }
}