-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-->
感谢您对我的项目感兴趣。我严重超出了我的深度,但我经常发现它是学习新语言的最佳方式。我将尝试将其整合到我的脚本中。 – 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