-1
我對JavaScript很陌生,我正在創建一個骰子游戲。我想創建一個骰子隨機出現的Javascript函數,並且我想在每次點擊按鈕時隨機地改變骰子。 這是JavaScript和HTML代碼:隨機骰子滾動
<!DOCTYPE html>
<html>
<head>
\t <title>Lancio del dado</title>
<script type="text/javascript">
var numero_dado = 1;
var tempo =1000;
setTimeout(function(){lancio_dado(); }, tempo);
</script>
<style>
table{
*border-collapse: collapse; /* IE7 and lower */
border-spacing: 0;
\t background:#ffffff !important; /* For IE*/
}
.bordered {
border: solid #ccc 10px;
\t -moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
\t behavior: url(border-radius.htc);
-webkit-box-shadow: 0 1px 1px #ccc;
-moz-box-shadow: 0 1px 1px #ccc;
box-shadow: 0 1px 1px #ccc;
}
</style>
</head>
<body>
<script type="text/javascript">
function lancio_dado(){
\t if(numero_dado == 1){
\t \t document.getElementById('primacella').innerHTML = "";
\t \t document.getElementById('secondacella').innerHTML = "";
\t \t document.getElementById('terzacella').innerHTML = "";
\t \t document.getElementById('quartacella').innerHTML = "";
\t \t document.getElementById('quintacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('sestacella').innerHTML = "";
\t \t document.getElementById('settimacella').innerHTML = "";
\t \t document.getElementById('ottavacella').innerHTML = "";
\t \t document.getElementById('nonacella').innerHTML = "";
\t \t numero_dado = 2;
\t \t setTimeout(function(){lancio_dado(); }, tempo);
\t \t breake();
\t }
\t if(numero_dado == 2){
\t \t document.getElementById('primacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('secondacella').innerHTML = "";
\t \t document.getElementById('terzacella').innerHTML = "";
\t \t document.getElementById('quartacella').innerHTML = "";
\t \t document.getElementById('quintacella').innerHTML = "";
\t \t document.getElementById('sestacella').innerHTML = "";
\t \t document.getElementById('settimacella').innerHTML = "";
\t \t document.getElementById('ottavacella').innerHTML = "";
\t \t document.getElementById('nonacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t numero_dado = 3;
\t \t setTimeout(function(){lancio_dado(); }, tempo);
\t \t breake();
\t }
\t if(numero_dado == 3){
\t \t document.getElementById('primacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('secondacella').innerHTML = "";
\t \t document.getElementById('terzacella').innerHTML = "";
\t \t document.getElementById('quartacella').innerHTML = "";
\t \t document.getElementById('quintacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('sestacella').innerHTML = "";
\t \t document.getElementById('settimacella').innerHTML = "";
\t \t document.getElementById('ottavacella').innerHTML = "";
\t \t document.getElementById('nonacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t numero_dado = 4;
\t \t setTimeout(function(){lancio_dado(); }, tempo);
\t \t breake();
\t }
\t if(numero_dado == 4){
\t \t document.getElementById('primacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('secondacella').innerHTML = "";
\t \t document.getElementById('terzacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('quartacella').innerHTML = "";
\t \t document.getElementById('quintacella').innerHTML = "";
\t \t document.getElementById('sestacella').innerHTML = "";
\t \t document.getElementById('settimacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('ottavacella').innerHTML = "";
\t \t document.getElementById('nonacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t numero_dado = 5;
\t \t setTimeout(function(){lancio_dado(); }, tempo);
\t \t breake();
\t }
\t if(numero_dado == 5){
\t \t document.getElementById('primacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('secondacella').innerHTML = "";
\t \t document.getElementById('terzacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('quartacella').innerHTML = "";
\t \t document.getElementById('quintacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('sestacella').innerHTML = "";
\t \t document.getElementById('settimacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('ottavacella').innerHTML = "";
\t \t document.getElementById('nonacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t numero_dado = 6;
\t \t setTimeout(function(){lancio_dado(); }, tempo);
\t \t breake();
\t \t
\t }
\t if(numero_dado == 6){
\t \t document.getElementById('primacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('secondacella').innerHTML = "";
\t \t document.getElementById('terzacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('quartacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('quintacella').innerHTML = "";
\t \t document.getElementById('sestacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('settimacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t document.getElementById('ottavacella').innerHTML = "";
\t \t document.getElementById('nonacella').innerHTML = "<img src='./img/punto.jpg' width='50' height='50'>";
\t \t numero_dado = 1;
\t \t setTimeout(function(){lancio_dado(); }, tempo);
\t \t breake();
\t \t
\t }
}
</script>
</script>
<button onclick="throwdice">Lancia il dado</button>
<center>
<table class= "bordered" width ="300" height="300">
\t <tr>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="primacella"></span></td>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="secondacella"></span></td>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="terzacella"></span></td>
\t </tr>
\t <tr>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="quartacella"></span></td>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="quintacella"></span></td>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="sestacella"></span></td>
\t </tr>
\t <tr>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="settimacella"></span></td>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="ottavacella"></span></td>
\t \t <td align="center" valign="middle" width="100" height="100"><span id="nonacella"></span></td>
\t </tr>
</table>
</center>
</body>
</html>
好的,太棒了,那你現在有什麼問題? –