Question

目前所有的单词都会出现，但我希望脚本随机生成30个单词中的12个

var randomdivs = $("wordstyle").get().sort(function(){
    return Math.round(Math.random())-0.5;
}).slice(0,12)
$(randomdivs).show();

以下是我希望脚本随机选择12个单词的30个单词的列表，然后我会将它们显示在一个单词游戏的网格中

<body>
<div class="wordcontainer">
<div id="randomdiv1" value="mat">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">m</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">t</div>
</div>
<div id="randomdiv2" value="man">
    <div id="1" class="wordcontainer ui-widget-content wordstyle ">m</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv3" value="mum">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">m</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">u</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">m</div>
</div>
<div id="randomdiv4" value="mug">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">m</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">u</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">g</div>
</div>
<div id="randomdiv5" value="cup">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">c</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">u</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv6" value="sin">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">s</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv7" value="sun">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">s</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">u</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv8" value="pen">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">p</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">e</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv9" value="can">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">c</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv10" value="pot">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">p</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">o</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">t</div>
</div>
<div id="randomdiv11" value="cat">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">c</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">t</div>
</div>
<div id="randomdiv12" value="gas">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">g</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">s</div>
</div>
<div id="randomdiv13" value="nip">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">n</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv14" value="pin">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">p</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv15" value="pit">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">p</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">t</div>
</div>
<div id="randomdiv16" value="tip">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">t</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv17" value="tin">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">t</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv18" value="dad">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">d</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">d</div>
</div>
<div id="randomdiv19" value="sad">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">s</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">d</div>
</div>
<div id="randomdiv20" value="dim">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">d</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">m</div>
</div>
<div id="randomdiv21" value="dip">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">d</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv22" value="bin">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">b</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv23" value="did">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">d</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">d</div>
</div>
<div id="randomdiv24" value="mam">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">m</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">m</div>
</div>
<div id="randomdiv25" value="map">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">m</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv26" value="tan">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">t</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">n</div>
</div>
<div id="randomdiv27" value="nap">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">n</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv28" value="sip">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">s</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv29" value="pip">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">p</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">i</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">p</div>
</div>
<div id="randomdiv30" value="sat">
    <div id="1" class="wordcontainer ui-widget-content wordstyle">s</div>
    <div id="2" class="wordcontainer ui-widget-content wordstyle">a</div>
    <div id="3" class="wordcontainer ui-widget-content wordstyle">t</div>
</div>
</div>
</body>

Answer 1

我认为你错过了“。”在你的wordstyle类选择器前面。 $（“wordstyle”）应该是$（“。wordstyle”），对吧？

通过这种改变似乎有效（假设样式是正确的，例如display：none / block）。这是我的jsFiddle玩它： http://jsfiddle.net/quant/dhXbG/

Answer 2

var randomdivs = $(".wordstyle").get().sort(function(){  // $("wordstyle") should 
                                                         // be $(".wordstyle")
    return Math.round(Math.random())-0.5;
}).slice(0,12);
$(".wordstyle").hide(); // first hide all
$(randomdivs).show()    // then show selected

<强> Demo

OR

var randomdivs = $(".wordstyle").hide().get().sort(function(){
    return Math.round(Math.random())-0.5;
}).slice(0,12);
$(randomdivs).show();

<强> DEMO

如何使我的脚本从30 - Jquery生成12个随机div

2 个答案: