如何从可能的10个中随机显示3个div?
这是我到目前为止所尝试的:
HTML:
<div id="1">Content 1</div>
<div id="2">Content 2</div>
<div id="3">Content 3</div>
<div id="4">Content 4</div>
<div id="5">Content 5</div>
<div id="6">Content 6</div>
使用Javascript:
function randomiseDiv()
{
// Define how many divs we have
var divCount = 6;
// Get our random ID (based on the total above)
var randomId = Math.floor(Math.random()*divCount+1);
// Get the div that's been randomly selectted
var chosenDiv= document.getElementById(randomId);
// If the content is available on the page
if (chosenDiv)
{
// Update the display
chosenDiv.style.display = 'block';
}
}
window.onload = randomiseDiv;
我更喜欢PHP解决方案,尽管现阶段的任何事情都是有益的。
答案 0 :(得分:1)
基于此问题的回答:Generate unique random numbers between 1 and 100,以下是如何在数组中选择n个唯一成员:
// removes n random elements from array this
// and returns them
Array.prototype.pick = function(n) {
if(!n || !this.length) return [];
var i = Math.floor(this.length*Math.random());
return this.splice(i,1).concat(this.pick(n-1));
}
因此,您可以应用它从您的收藏中挑选3个div并显示它们:
// build the collection of divs with your framework of choice
// jQuery would be $('div'), Mootools/Prototype $$('div')
var divs = document.getElementsByTagName('div');
// then pick 3 unique random divs and display them
// each is part of ECMAscript5 and a number of current js frameworks
divs.pick(3).each(function (div) {
div.style.display = "block";
});
// Prototype shortcut is divs.pick(3).invoke('show');
答案 1 :(得分:1)
您可以在数组中使用可能的div内容,例如$divs
,然后选择三个:
$divs = array("Content 1", "Content 2", "Content 3"); for($i = 1; $i <= 3; $i++) { shuffle($divs); $pick = array_pop($divs); echo "<div>$pick</div>"; }
您还应该添加某种错误检查,以查看数组中是否至少有3个值。
另一种可能的解决方案是使用array_rand
。
答案 2 :(得分:0)
如果您正在寻找PHP方式,您可以尝试这一点,假设$ div是一个包含6个元素的数组。
for($i = 1; $i <= 3; $i++) {
$div_num = mt_rand(1,6);
echo $div[$div_num];
}