随机化并在页面加载时显示给定数量的 if 元素

Randomize and show a given number if elements on pageload

本文关键字:元素 if 显示 加载 随机化      更新时间:2023-09-26

我想在页面加载时随机化元素 - 无论有多少元素,只显示其中的 4 个。

我最接近的是:

$(document).ready(function() {
$(".itembox.newcenterbox").hide();
var elements = $(".itembox.newcenterbox");
var elementCount = elements.size();
var elementsToShow = 4;
var alreadyChoosen = ",";
var i = 0;
while (i < elementsToShow) {
    var rand = Math.floor(Math.random() * elementCount);
    if (alreadyChoosen.indexOf("," + rand + ",") < 0) {
        alreadyChoosen += rand + ",";
        elements.eq(rand).show();
        ++i;
    }
}
});

它在我的本地网站上对我有用 - 但它破坏了我的实时网站,我不知道为什么。

有没有更好的方法可以做到这一点?

也许你的elementCount小于elementsToShow?在这种情况下,您将始终获得 0 到 3 之间的rand值,这将导致无限循环。

请尝试下面的代码。此外,当您检查rand索引时,我删除了不必要的循环迭代。

$(document).ready(function() {
    var elements = $(".itembox.newcenterbox");
    var elementsToShow = 4;
    var i = 0;
    if(elements.length < elementsToShow) return;
    for (i = 0; i < elementsToShow; i++) {
        elements.splice(Math.floor(Math.random() * elements.length), 1);
    }
    elements.hide();
});