我有一个使用div的3x3网格布局,点击按钮后我需要div来随机重新排列。以下链接说明了我需要创建的内容。
我不需要帮助HTML布局也不需要CSS设计本身,而是如何使用本机Javascript或jQuery创建onclick
函数以便“shuffle”和“sort” “按钮工作。如果可能的话,最好是Jquery,因为我对它的语法更加熟悉。
我事先感谢所有人的帮助和支持。我非常感谢任何有用的链接供我自己研究。
我并不是在寻找其他人为我做我的工作,虽然解决方案受到高度赞赏,但也许会以伪代码的方式指导我。
答案 0 :(得分:0)
您可以使用许多不同的算法来随机播放"物品清单。但是,我最喜欢的方法之一是以下因为它非常简洁。
一般随机播放算法:
代码示例
这是一个应该做的技巧:
$container = $("#container");
$divList = $("div");
$("#shuffle").on("click", function(){
//copy and remove all divs
$divCopy = $divList.clone(true);
$("div").remove();
while($divCopy.length > 0){
//chose random index of div array
var randomIndex = Math.floor(Math.random() * $divList.length);
$container.append($divCopy.splice(randomIndex, 1));
}
});
https://jsfiddle.net/oruq1qou/
有一个完整的工作版本如果您有兴趣寻找解决此问题的其他方法,我建议您阅读不同类型的随机播放算法。