製作網格集大小不管有多少單詞

我有一個3個字母的單詞列表動態生成一個網格。製作網格集大小不管有多少單詞

問題是我需要一個6x6網格，並且如果列表中沒有足夠的單詞以方便6x6（12個單詞），那麼它將不會是所需的大小，並且只能是一個與網格一樣大的網格在它的話。

我該如何做到這一點，它總是會產生一個6x6的網格，爲這些詞語隨機生成位置並填充空單元格的空隙？

var listOfWords = {}; 

var ul = document.getElementById("wordlist"); 

var i; 
for(i = 0; i < ul.children.length; ++i){ 
listOfWords[ul.children[i].getAttribute("data-word")] = { 
    "pic" : ul.children[i].getAttribute("data-pic"), 
    "audio" : ul.children[i].getAttribute("data-audio") 
}; 
} 

console.log(listOfWords); 
var shuffledWords = Object.keys(listOfWords).slice(0).sort(function() { 
return 0.5 - Math.random(); 
}).slice(0, 12); 
var guesses = {} 
console.log(shuffledWords); 
var tbl = document.createElement('table'); 
tbl.className = 'tablestyle'; 
var wordsPerRow = 2; 

for (var i = 0; i < Object.keys(shuffledWords).length - 1; i += wordsPerRow) { 
var row = document.createElement('tr'); 

for (var j = i; j < i + wordsPerRow; ++j) { 
    var word = shuffledWords[j]; 
    guesses[word] = []; 

    for (var k = 0; k < word.length; ++k) { 
     var cell = document.createElement('td'); 


     $(cell).addClass('drop').attr('data-word', word); 
     cell.textContent = word[k]; 
     // IF FIREFOX USE cell.textContent = word[j]; INSTEAD 
     row.appendChild(cell); 
    } 
} 
tbl.appendChild(row); 
} 

document.body.appendChild(tbl);

我已經試過這一點，但不能讓它工作....

while(listOfWords.length < 12) 
listOfWords.push(" ");

來源

2012-07-30 m0onio

6x6 = 36.你是什麼意思到12？ – 2012-07-30 09:29:59

12，3個字母的單詞，因爲它們都是3個字母@joerajeev – m0onio 2012-07-30 09:31:58

請你告訴我你的意思？ http://jsfiddle.net/smilburn/bEYJH/11/ @joerajeev – m0onio 2012-07-30 09:35:56

你有沒有試着用所需要的尺寸創建表之前，然後把這個詞來隨機TD和tr？

來源

2012-07-30 09:35:43

我不知道如何去做這件事@joerajeev – m0onio 2012-07-30 09:48:39

你能用這個工作嗎？ http://jsfiddle.net/bEYJH/16/ – 2012-07-30 09:52:01

需要這些詞每次都是隨機的，雖然@joerajeev – m0onio 2012-07-30 09:53:56

製作網格集大小不管有多少單詞

回答

相關問題