Code de jeu de puzzle d'image de personnage jQuery

Il s'agit d'un code de jeu de puzzle d'images de personnages jQuery simple et amusant. Cliquez pour démarrer le jeu et mélanger les images de manière aléatoire. Le temps et les étapes de fonctionnement sont enregistrés.

code js
<script type="text/javascript">
$(fonction(){
var tt=null;
//Durée de fin du jeu et nombre d'étapes
var fois=0;
var temps=0;
// Perturbez le tableau d'images précédent et préparez-vous
var src= Tableau();
src.push("images/201.png");
src.push("images/202.png");
src.push("images/203.png");
src.push("images/204.png");
src.push("images/205.png");
src.push("images/206.png");
src.push("images/207.png");
src.push("images/208.png");
src.push("images/209.png");
//Les événements du bouton s'activent. . . Commencez le jeu

$('#bouton').click(function(){
clearInterval(tt)
// Le temps revient à 0
        temps=0;
fois=0;
​ ​ // Venez régler l'heure ;
tt=setInterval(shij,1000)
fonction shij(){
Heure++;
        $(".time>p>span").text(time)
       }
                                                                                                                                                                                                                                                      // trié dans le désordre
var srcUsing= new Array();
pour(var p=0; p<src.length;p++){
srcUsing[p]=src[p];
        }
        var newArry= new Array();
pour(var i=0;i< $("#box img").length;i++){
                  newArry.push(srcUsing.splice(Math.floor(Math.random()*srcUsing.length), 1));
                                                                                    pour(var j=0;j<newArry.length;j++){
              $("#box img").eq(j).attr("src",String(newArry[j]));
                                                                           
​ ​ //Définissez une image vierge,
var Arrps=document.getElementById("box").getElementsByTagName("img");
pour(var i=0;i<Arrps.length;i++){
          Arrps[i].onclick=function(){
               if (this.getAttribute("src")=="images/201.png");
​ ​ ​ changeP(this,Arrps);
          };
       }
})
   
     
     // 判断位置
    changement de fonctionP(ob,Arrps){
           varNi=0;
           varNj=0;

          pour(var i=0;i<Arrps.length;i++){
           si(Arrps[i]==ob)
           {
            // alerte(ob)
            Ni=i;
           }
            
          if(Arrps[i].getAttribute("src")=="images/201.png")
          {
          Nj=i;
          }
            
           }
            // 绝对值
           si(Math.abs(Ni-Nj)==3)
           {
              var temperOb=ob.getAttribute("src"); 
              ob.setAttribute("src","images/201.png");
              Arrps[Nj].setAttribute("src",temperOb);
              fois++;
              si c'est vrai();
               
             }sinon si((Ni-Nj)==1&&(Ni%3)!=0){
             var temperOb=ob.getAttribute("src"); 
              ob.setAttribute("src","images/201.png");
              Arrps[Nj].setAttribute("src",temperOb);
              fois++;
              si c'est vrai();
               
             }sinon si((Ni-Nj)==-1&&(Ni%3)!=2){
              var temperOb=ob.getAttribute("src"); 
              ob.setAttribute("src","images/201.png");
              Arrps[Nj].setAttribute("src",temperOb);
              fois++;
              si c'est vrai();
             } 
              $(".bu>p>span").text(times) 
        }
​ ​ ​
           fonction ifright(){
          var ps=document.getElementById("box");
          var Arrps=ps.getElementsByTagName("img");
                  pour(var i=0;i<src.length;i++){
                   if(src[i]!=Arrps[i].getAttribute("src")) return;
                }
alert("Félicitations, vous avez réussi..."+"n"+"utilisé"+fois+"étape")
        }
})

</script>