从数组中随机选择多于一次的克隆Div

我正在随机显示一定数量的div。但是，我想允许重复div，所以我假设我需要克隆多次选择的div。我所拥有的一切，除了克隆一部分下来，在这个小提琴所示：从数组中随机选择多于一次的克隆Div

正如你可以看到，如果一个div选择不止一次，它只显示了它的第一个实例。如果有必要的话，任何人都可以提供克隆帮助，那会很好。谢谢。下面是jQuery代码至今：

$("#button").click(function() { 
    $("div.item").css("display", "none"); 
    var idValues = []; 
    var randomValues = []; 
    $("div.item").each(function() { 
    idValues.push($(this).attr("data-id")); 
    }); 
    for (var i = 0; i < 4; i++) { 
    randomValues.push(idValues[Math.floor(Math.random() * idValues.length)]); 
    } 
    for (var j = 0; j < randomValues.length; j++) { 
    group = randomValues[j]; 
    $('div.item').each(function() { 
     if ($(this).attr("data-id") == group) { 
     $(this).css("display", "block"); 
     } 
    }); 
    } 
});

编辑：我在想，我需要插入这样的事情：

if ($(this).length) { 
     $this.clone().appendTo("#container").css("display", "block"); 
    }

来源

2015-12-07 Beau

你的代码只显示/隐藏** **现有的div，没有创建/销毁/克隆回事。你期望的效果是什么？ –

编辑是为了展示我想要克隆的内容，但是Rory回答得非常好：当一个div不止一次被选中时，它会通过克隆多次显示。 – Beau

您大量可以在这里简化你的逻辑。首先设置一个不变的元素.item，您可以随意使用这个元素进行选择。然后你可以有一个容器来追加原始文件的克隆。然后你可以删除三个循环，只需要运行一个循环，为你选择一个随机的.itemdiv。试试这个：

$("#button").click(function() { 
    var $poolDivs = $('#pool .item'); 
    var $randomContainer = $('#random').empty(); 
    for (var i = 0; i < 4; i++) { 
    $randomContainer.append($poolDivs.eq(Math.floor(Math.random() * $poolDivs.length)).clone()); 
    } 
});

Updated fiddle

来源

2015-12-07 17:52:18

哇，非常感谢Rory，这真的没有简化它。这正是我想要做的。 – Beau

从数组中随机选择多于一次的克隆Div

回答

相关问题