Js智能拼圖游戲

2024-09-05 12:21:09

字體：大中小

供稿：網(wǎng)友

智能拼圖游戲網(wǎng)頁版JS+HTML代碼，盧溫禾發(fā)布，應(yīng)該是個(gè)數(shù)字拼圖游戲，把數(shù)字按1——9的順序排列好，就拼圖成功了，游戲開始后，單擊數(shù)字會(huì)自動(dòng)向空白處移動(dòng)。這個(gè)智能拼圖游戲有個(gè)缺陷，也就是游戲的初始化不是每次都能成功。也希望高手繼續(xù)完善。

<html><head><title>智能拼圖游戲網(wǎng)頁版</title><style>body{text-align:center;}table{margin:100 auto;}div{width:94px;height:94px;text-align:center;font-size:48;background-color:red;padding-top:20;display : none ;}</style><script>function starGame(){        document.getElementById("but").style.display="none";        init();        for(var i=1;i<9;i++){            document.getElementById(i).style.display="block";        }        document.getElementById("but2").style.display="block";}function changeDis(did){if(Math.abs(did-mubiao)==1||Math.abs(did-mubiao)==3){var yuandiv=document.getElementById(did);var mubiaodiv=document.getElementById(mubiao);mubiaodiv.innerHTML=yuandiv.innerHTML;yuandiv.innerHTML="0";mubiaodiv.style.display="block";yuandiv.style.display="none";mubiao=did;count++;if(isSuss()){                endTime=new Date();                time= (endTime.getTime()-beginTime.getTime())/1000;                window.alert("Greet!/n時(shí)間:"+time+"秒，次數(shù)："+count+"/n重新開始！");                init();            }}}function isSuss(){        for(var i=1;i<9;i++){            if(document.getElementById(i).innerHTML!=i){                return false;            }        }        return true;    }function init(){        do{            var num = [1,2,3,4,5,6,7,8];            for(var i=8;i>0;i--){                var innum=Math.floor(Math.random()*i)+1;                document.getElementById(i).innerHTML=num[innum-1];                num.splice(innum-1,1);            }        }while(isSuss());        mubiao=9;        count=0;        beginTime=new Date();    }function reStart(){        init();        for(var i=1;i<9;i++){            document.getElementById(i).style.display="block";        }        with(document.getElementById(9)){            style.display="none";            innerHTML="0";        }    }</script></head><body><h1>智能拼圖游戲</h1><button id="but" onclick="starGame()">開始游戲</button><table><tr>	<td><div   class="2coa0mc"   id="1" onclick="changeDis(1)">1</div></td>	<td><div   class="egeokq2"   id="2" onclick="changeDis(2)">2</div></td>	<td><div   class="2we0iau"   id="3" onclick="changeDis(3)">3</div></td><tr><tr>	<td><div   class="y0wgaoq"   id="4" onclick="changeDis(4)">4</div></td>	<td><div   class="co2kims"   id="5" onclick="changeDis(5)">5</div></td>	<td><div   class="2ksowmq"   id="6" onclick="changeDis(6)">6</div></td><tr><tr>	<td><div   class="mwciasi"   id="7" onclick="changeDis(7)">7</div></td>	<td><div   class="mu20kog"   id="8" onclick="changeDis(8)">8</div></td>	<td><div   class="i0qkgwy"   id="9" onclick="changeDis(9)">0</div></td><tr></table><button id="but2" style="display:none;" onclick="reStart()">重新開始</button></body></html>

上一篇：網(wǎng)頁連連看JQuery版游戲代碼

下一篇：HTML5 Canvas API實(shí)現(xiàn)拼圖游戲