2

現時点ではすべての単語が表示されていますが、スクリプトで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>
4

2 に答える 2

3

あなたは「。」を見逃していると思います。ワードスタイルクラスセレクターの前。$（ "wordstyle"）は$（ "。wordstyle"）である必要がありますよね？

その変更により、機能しているように見えます（スタイリングが正しいと仮定します。たとえば、display：none / block）。これが私のjsFiddleで遊ぶためのものです：http： //jsfiddle.net/quant/dhXbG/

于 2012-07-11T14:56:18.990 に答える
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

デモ

また

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

デモ

于 2012-07-11T14:56:56.690 に答える