簡體   English   中英

JavaScript滑塊拼圖-亂碼

[英]JavaScript slider puzzle - scrambling values

(我是JS的新手,請耐心等待)我正在用桌子制作滑動益智游戲。 我需要一個可以對值進行加擾的函數,但是我不確定如何將其顯示在表單元格中。 現在,我的代碼只是按順序顯示數字。 我有兩個函數-一個用於構建表,另一個用於對值進行隨機排序:

    var _r = 3;
    var _c = 3;


//initializes the puzzle
function newPuzzle(r, c)
{
   var table = document.createElement("table");
   table.id = "myTable";

   for (var i = 0; i < r; i++)
   {
      var row = document.createElement('tr');
      for (var j = 0; j < c; j++)
      {
         var column = document.createElement('td');
         row.appendChild(column);    
      }
      table.appendChild(row);
   }
   document.body.appendChild(table);


   //end of table creation
   //populate the table
   var cell = new Array(r);
   for (var i = 0; i < r; i++)
   {
      cell[i] = new Array(c);
      for (var j = 0; j < c; j++)
      {
         cell[i][j] = i*c + j;
      }  
   }
   cell[0][0] = " ";

   for (var i = 0; i < cell.length; ++i)
   {
        var entry = cell[i];
        for (var j = 0; j < entry.length; ++j)
        {
            var n = 0;
            var gridTable = document.getElementsByTagName("table");
            gridTable[0].rows[i].cells[j].innerHTML = cell[i][j];
            document.getElementById("myTable").rows[i].cells[j].id = "even" + (i*c+j);

        }    
   }

 shuffle();
}


function shuffle()
{

 //declare and populate array
 var _array = new Array();

 for (var i = 0; i <= r*c; i++)
 {
   _array[i] = i;
 }

 //shuffle tiles
 for (var i = 0; i <= r*c; i++)
 {
   var rand = Math.floor(Math.random() * _array.length) + i;
   var temp = _array[rand];
   _array[rand] = _array[i];
   _array[i] = temp;
 }

 //check to see if puzzle is solveable
 var count = 0;
 for (var i = 0; i <= r*c; i++)
 {
   for (var j = i; j <= r*c; j++)
   {
      if (_array[j] < _array[i])
      {
         count++;
      }
   }
 }

 if (Math.floor(count/2) != count/2)
 {
   shuffle();
 }
 else
 {
   for (var i = 0; i < r*c; i++)
   {

      //This is where I'm not sure what to do

      document.getElementsByTagName("td")[i].innerHTML = _array[i]+1;
   }
 }

}

不確定,這可能對您有幫助。

為了求解任何數學系列,可以使用以下算法。 即使在某些情況下,它也無法滿足您的預期答案,但是在其他方面它是正確的。

步驟如下:

  1. 得到數字之間的差異,如下所示:
  2. 保持差異直到看起來相同(差異為0)。
  3. 放入相同的最后一個數字,該數字在該序列中是相同的,並通過添加該差異來增加序列。

示例如下:

1       2       3       4       5       6       **7**

   1        1       1       1       1       **1**   


1       4       9       16      25      **36**      
     3      5       7       9       **11**          
        2       2       2       **2**               



1       8       27      64      125     **216**     
    7       19      37      61      **91**          
        12      18      24      **30**              
            6       6       **6**                   
                0       **0**                       

下面的js代碼中實現了與上述相同的算法。

//the input

var arr=[1,4,9,16];

var pa6inoArrayMelvo = function(arrr){
var nxtArr=[];
    for(i=0;i<arrr.length;i++){
        if(arrr[i+1] != undefined){
            nxtArr.push(arrr[i+1] -arrr[i]);
        }
    }
    return nxtArr;
}
var keepArray=[];

var keepAlltheArray= function(ar){
    var tempArr=[];

        keepArray.push(ar);
        if(ar.length>1){

          tempArr=pa6inoArrayMelvo(ar);       
          keepAlltheArray(tempArr);
        }else{
            generateArray(keepArray.length-1);
            console.log("ans is:"+keepArray[0]);
        }


}

var generateArray=function(idx){
    if(keepArray[idx+1]){
        var a=keepArray[idx+1];
        var b=keepArray[idx];
        var ans=a[a.length-1]+b[a.length-1];
        keepArray[idx].push(ans);
    }else{
        var ans=keepArray[idx][keepArray[idx].length-1];
        keepArray[idx].push(ans);
    }
    if(idx>0){
        generateArray(idx-1);
    }
}

keepAlltheArray(arr);

您需要將變量rc傳遞到shuffle函數中:

function newPuzzle(r, c)
{ 
    ...
    shuffle(r, c);
}


function shuffle(r, c) {
    ...
    if (Math.floor(count/2) != count/2)
    {
        shuffle(r, c);
    }
}

並且還調用newPuzzle(_r, _c); 我以為你是。

有了更改,它才起作用,唯一的問題是 在這種情況下為NaN ,您可以通過檢查值是否為NaN並將其替換為空格來輕松解決此問題:

if(isNaN(_array[i]))
    document.getElementsByTagName("td")[i].innerHTML = " ";

小提琴的例子

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM