JavaScript滑块拼图-乱码

Question

（我是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;
   }
 }

}

Answer 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);

Answer 2

您需要将变量r和c传递到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 = " ";

小提琴的例子