3

私は、ブラウザの更新時に7つのDivをランダム化する、合理的な単純なスクリプト機能のように見えるものを取得するために戦っています。

HTMLは次のように表示されます。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Strict</title>

<link rel="stylesheet" type="text/css" href="style.css">

<script type="text/javascript" src="jquery-1.9.1.min.js"></script>

 <script>
    var divs = $("div.Image").get().sort(function(){ 
    return Math.round(Math.random())-0.5; //random so we get the right +/- combo
    }).slice(0,4)
    $(divs).show();
 </script>

</head>

<body>


<div class="Image"><img src="image1.jpg">1</div>
<div class="Image"><img src="image2.jpg">2</div>
<div class="Image"><img src="image3.jpg">3</div>
<div class="Image"><img src="image4.jpg">4</div>
<div class="Image"><img src="image5.jpg">5</div>
<div class="Image"><img src="image6.jpg">6</div>
<div class="Image"><img src="image7.jpg">7</div>

</body>
</html>

そこにあるjQueryスクリプトは次のようになります。

var divs = $("div.Image").get().sort(function(){ 
return Math.round(Math.random())-0.5; //random so we get the right +/- combo
}).slice(0,4)
$(divs).show();

CSSは以下に制限されています：

div.Image {
display: none;
}

現在、何もロードされていません。

私はまだこれに真新しいので、これが初歩的なものであるならば、私は自分自身を許さなければならないでしょう。

4

5 に答える 5

3

コードを で囲んでくださいdocument.ready。

$(document).ready(function(){
    var divs = $("div.Image").get().sort(function()
    {
       return Math.round(Math.random())-0.5; //random so we get the right +/- combo
    }).slice(0,4);

    $(divs).show();
});
于 2013-03-04T10:20:13.840 に答える
3

関数を$(document).readyで囲み、ページが完全に読み込まれた後に読み込まれるようにします。スクリプトのdiv実行時に要素がページにロードされていません。

$(document).ready(function(){
    var divs = $("div.Image").get().sort(function(){ 
    return Math.round(Math.random())-0.5; //random so we get the right +/- combo
    }).slice(0,4)
    $(divs).show();
});

作業例: http://jsfiddle.net/FyzXF/

于 2013-03-04T10:20:51.677 に答える
2

これを試して、

$(function(){
   var divs = $("div.Image").get().sort(function(){ 
                 return Math.round(Math.random())-0.5; //random so we get the right +/- combo
              }).slice(0,4)
   $(divs).show();
});
于 2013-03-04T10:21:16.560 に答える
1

まず、js コードを$(function(){ ... })ブロックにラップする必要があります。

$(function(){

    var divs = $("div.Image").get().sort(function(){ 
    return Math.round(Math.random())-0.5; //random so we get the right +/- combo
    }).slice(0,4)
    $(divs).show();

});

これは、DOM が完全にロードされたときにコードが実行されることを意味します。

于 2013-03-04T10:21:18.167 に答える
1

とてもシンプル。これを試して

$(function(){
  var ind = Math.floor((Math.random()*7)+1);
  $("div.Image:eq("+ind+")").show();
});
于 2013-03-04T10:29:27.943 に答える