20多行js代碼寫一個最簡單的3×3拼圖遊戲 – Javascript教程_JS教程_技術文章 – 程式設計聯盟

 

按慣例,截圖是必須的:

玩法:方向鍵

勝負:排列出12345678_就算勝利瞭!

兼容各瀏覽器,使用瞭“逆序和”判定,來保證一定有解。

接下來是js代碼,不需要HTML配合瞭,直接放入body就行瞭。直接體驗就輕輕點擊這裡。

 

 

<script> 

function gd(){ 

    var arr=[1,2,3,4,5,6,7,8].sort(function(){return Math.random()>.5}); 

    for(var i=0,k=0,n=arr.length;i<n;i++) 

        for(var j=i+1;j<n;j++) 

            arr[i]>arr[j] && (k=1-k); 

    k && (i=arr[n-2]) && (arr[n-2]=arr[n-1]) && (arr[n-1]=i); 

    return arr.concat(0); 

function v(){ 

    return (d+'').replace(0,' ').replace(/(.{5}),/g,'$1\r\n'); 

document.writeln('<textarea id="t1" readonly autocomplete="off" style="overflow:hidden;width:70px;height:70px;"></textarea>'); 

var p=8, d=gd(), t1=document.getElementById("t1"); 

setTimeout('t1.value=v()',10); 

document.onkeyup = function (e){ 

    var k = (e||window.event).keyCode-36, q; 

    if(k==1 && (p%3<2) || k==3 && (p%3>0) || k==2 && p<6 || k==4 && p>2){ 

        q=p+(k>2?1:-1)*(k%2*2-3); 

        d[p]=d[q], d[p=q]=0; 

        if((t1.value=v()).match(/^1,2,3[^\d]*4,5,6[^0]* $/)) 

            alert('YOU WIN !'); 

    } 

</script> 

<a href="javascript:void(p=8,d=gd(),t1.value=v())">重玩</a>   補充:重新寫瞭一個任意行列的版本,做瞭一些增強,看這裡《30多行js代碼寫一個M*N拼圖遊戲》,能任選M*N佈局,即時切換,即時replay.

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。