Word Wheel遊戲 - 用Javascript隨機化字母

-1

感謝Adrian與我分享一些代碼。不幸的是，我無法將其整合到我的項目中（新手！），但它確實使我走上了正確的道路。經過一番反思之後，我添加了一個函數來打亂字母，效果不錯。唯一的問題是我的代碼無法在CodePen之外工作。我認爲從我的弗蘭肯斯坦方法到編碼，一些錯誤已經悄然而至！無論如何，我如此親密，任何人都可以幫忙，還是它太混亂而無法打擾？Word Wheel遊戲 - 用Javascript隨機化字母

//GET RANDOM 9 LETTER WORD 

var wordlist = ["aardvarks", "aasvogels", "abamperes", "abandoned" 
]; 

var randomNumber = parseInt(Math.random() * wordlist.length); 
var name = wordlist[randomNumber];   

if(document.getElementById("resultRandomWord")){ 
document.getElementById("placeholderRandomWord").removeChild(document.getElementById("resultRandomWord")); 
} 
var element = document.createElement("div"); 
element.setAttribute("id", "resultRandomWord"); 
element.appendChild(document.createTextNode(name)); 
document.getElementById("placeholderRandomWord").appendChild(element); 

//START This function shuffles list items 
(function($){ 
$.fn.shuffle = function() { 
    return this.each(function(){ 
     var items = $(this).children().clone(true); 
     return (items.length) ? $(this).html($.shuffle(items)) : this; 
    }); 
} 

$.shuffle = function(arr) { 
    for(var j, x, i = arr.length; i; j = parseInt(Math.random() * i), x = arr[--i], arr[i] = arr[j], arr[j] = x); 
    return arr; 
} 
})(jQuery); 
//END This function shuffles list items 

//SPLIT 9 LETTER WORD 
var str = $('#resultRandomWord').html(); 
var spl = str.split(''); 
var len = spl.length; 
var i = 0; 
setInterval(function(){ 

if(i < len) 
{ 
    if(spl[i] != " "){ 
    $('.letters').append('<li>'+spl[i]+'</li>')//DISPLAY WORD AS SEPARATE LETTER AND AS LIST ITEMS 
    $('.letters').shuffle();//Call shuffle function 
    } 
} 
i++; 
},200) 


//REVEAL ANSWER (JQUERY) 
$(document).ready(function(){ 
$(".reveal").click(function(){ 
$("#placeholderRandomWord").slideToggle(); 
    }); 
});

和HTML：

<div id="outer_circle"> 
<ul class="lines"> 
<li></li><!--nth(1)--> 
<li></li><!--nth(2)--> 
<li></li><!--nth(3)--> 
<li></li><!--nth(4)--> 
</ul> 
<ul class="letters"> 
<!--This is where the letters go, they are wrapped in <li> tags--> 
</ul> 
<div id="inner_circle"> 
</div><!--letters--> 
</div><!--outer_circle--> 


<div id="answer-wrapper"> 
<button type="button" class="reveal" onclick>Reveal/Hide Answer</button> 
<div id="placeholderRandomWord"> 

</div><!--answer--> 
</div><!--answer-wrapper-->

來源

2014-10-06 Matt

通常我會問，看你自己的嘗試，但我們已經取得了很大的進步上休息，它看起來像這只是一個小的絆腳石塊。因此，它不進行破壞性測試，但下面的函數應該做你需要的東西：

function randomise(word) { 
    var result = ""; 
    while (word != "") { 
     var pos = Math.floor(Math.random() * word.length); 
     result += word[pos]; 
     word = word.substring(0, pos) + word.substring(pos+1); 
    } 
    return result; 
}

它只是選擇0之間的隨機數（字的長度 - 1），挑選出這封信，並從刪除它原始單詞，然後重複，直到原始單詞爲空。

來源

2014-10-06 15:53:26

感謝您對我的項目感興趣。我嚴重超出了我的深度，但我經常發現它是學習新語言的最佳方式。我將嘗試將其整合到我的腳本中。 – Matt 2014-10-06 16:27:32

再次感謝Adrian的建議。不幸的是我無法將它整合到遊戲中，我仍然有很多要學習！重新思考後，我設法根據需要對這些字母進行洗牌，但是我的代碼如此科學怪人，它不能在CodePen之外工作。如果您對我的進步感興趣，我已經更新了我的問題。 – Matt 2014-10-07 14:51:05

您可以將'var name = wordlist [randomNumber];'改成'var name = randomise（wordlist [randomNumber]）;'。 – 2014-10-07 21:51:29

Word Wheel遊戲 - 用Javascript隨機化字母

回答

相關問題