設置字數限制

Question

在我的拼寫遊戲中，我將單詞存儲在「ul」中的html中。這些詞然後填充網格，以便人們可以拼寫它們。問題是列表中的所有單詞都出現了，我希望它能說出我想從列表中填充多少單詞以填充網格。最好我希望它在html中，但在腳本中會很好。

有人可以告訴我如何去做這件事嗎？

這裏是單詞的列表...

<ul style="display:none;" id="wordlist"> 

    <li data-word="mum" data-audio="http://www.wav-sounds.com/cartoon/porkypig2.wav" data-pic="http://www.clker.com/cliparts/5/e/7/f/1195445022768793934Gerald_G_Lady_Face_Cartoon_1.svg.med.png"></li> 

    <li data-word="cat" data-audio="http://www.wav-sounds.com/cartoon/bugsbunny2.wav" data-pic="http://www.clker.com/cliparts/c/9/9/5/119543969236915703Gerald_G_Cartoon_Cat_Face.svg.med.png"></li> 

    <li data-word="bear" data-audio="http://www.wav-sounds.com/cartoon/daffyduck1.wav" data-pic="http://www.clker.com/cliparts/a/2/c/0/1195440948271207911zeimusu_spotty_dog.svg.med.png"></li> 

    <li data-word="bug" data-audio="http://www.wav-sounds.com/cartoon/daffyduck2.wav" data-pic="http://www.clker.com/cliparts/4/b/4/2/1216180545881311858laurent_scarabe.svg.med.png"></li> 

    <li data-word="rat" data-audio="http://www.wav-sounds.com/cartoon/bugsbunny1.wav" data-pic="http://www.clker.com/cliparts/C/j/X/e/k/D/mouse-md.png"></li> 

    <li data-word="father" data-audio="http://www.wav-sounds.com/cartoon/porkypig1.wav" data-pic="http://www.clker.com/cliparts/3/a/6/6/119544474191128182Gerald_G_Man_Face_6_-_World_Label.svg.med.png"></li> 

    </ul> 

由於動態創建網格中的腳本是相當長，它更容易只給一個小提琴...... http://jsfiddle.net/smilburn/Dxxmh/18/

Answer 1

似乎我你只需要UI的數量改變單詞的數量你想

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

DEMO只與LI S的2主動 - 它給兩組詞

的，否則做

var maxWords = 20; // larger or equal to 6 to cover the picture 
for (i = 0; i < maxWords; ++i) { 
    listOfWords.push({ 
    "name": ul.children[i].getAttribute("data-word"), 
    "pic": ul.children[i].getAttribute("data-pic"), 
    "audio": ul.children[i].getAttribute("data-audio") 
    }); 
} 


for (var x = 0; x < listOfWords.length; x++) { // change here too 

---

隨機

var maxWords = 20; // larger or equal to 6 to cover the picture 
var alreadyStored =""; 
var aWord,idx; 
while (listOfWords.length < maxWords) { 
    idx = Math.floor(Math.random()*ul.children.length); 
    aWord = ul.children[idx].getAttribute("data-word"); 
    if (alreadyStored.indexOf("@"+aWord+"@")!=-1) continue; 
    listOfWords.push({ 
    "name": aWord, 
    "pic": ul.children[idx].getAttribute("data-pic"), 
    "audio": ul.children[idx].getAttribute("data-audio") 
    }); 
    alreadyStored += "@"+aWord+"@"; 
} 
alreadyStored =null;