2

私は投稿の指示に従っています: jQuery fadeIn() 複数の div で異なる間隔

しかし、私はそれを機能させることができません..何が悪いのですか 

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>


<script type="text/javascript">
$('.fadeIn').each(function(){
        var $this = $(this);
        $this.before('<div>&nbsp;</div>');
        setTimeout(function(){ 
            $this.prev().remove(); 
            $this.fadeIn(Math.floor(Math.random()*1500)); 
        }, Math.floor(Math.random()*1500));
    }
);​

</script>       

<style>

.fadeIn{
   display: none; 
}​
​
</style>

</head>



<body>

<div class="fadeIn">Test 1</div>
<div class="fadeIn">Test 2</div>
<div class="fadeIn">Test 3</div>
<div class="fadeIn">Test 4</div>
<div class="fadeIn">Test 5</div>
<div class="fadeIn">Test 6</div>​
</body>
</html>
4

4 に答える 4

2

実際のデモ

jQuery ライブラリをインポートする必要があります。
あなたの前にそれを追加してください<script>：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

次のようになります。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>    
<script type="text/javascript">

(function($){ // remap the '$' character to jQuery

$('.fadeIn').each(function(){
        var $this = $(this);
        $this.before('<div>&nbsp;</div>');
        setTimeout(function(){ 
            $this.prev().remove(); 
            $this.fadeIn(Math.floor(Math.random()*1500)); 
        }, Math.floor(Math.random()*1500));
)};

})(jQuery);


</script>

または、$(document).ready(function(){ /*your code here*/ });!

于 2012-05-22T10:01:53.320 に答える
1

1) jquery ライブラリを含める必要があります

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

$(function()2）コードをまたはでラップする必要があります jQuery(function($)

jQuery(function($) {
    $('.fadeIn').each(function(){
            var $this = $(this);
            $this.before('<div>&nbsp;</div>');
            setTimeout(function(){ 
                $this.prev().remove(); 
                $this.fadeIn(Math.floor(Math.random()*1500)); 
            }, Math.floor(Math.random()*1500));
        }
    );​
});
于 2012-05-22T10:03:13.030 に答える
0

まず、コードが機能しているフィドルです。

あなたがしなかったのは、jquery ライブラリを head 要素にインポートすることだけでした。

于 2012-05-22T10:06:11.667 に答える
0

コードを更新する必要があります：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    $('.fadeIn').each(function () {
        var $this = $(this);
        $this.before('<div>&nbsp;</div>');
        setTimeout(function () {
            $this.prev().remove();
            $this.fadeIn(Math.floor(Math.random() * 1500));
        }, Math.floor(Math.random() * 1500));
    });​
})
</script>

の

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

jQuery ライブラリをページに追加します。これにより、jQuery 関数を使用できるようになります。そして、コードを

$(function() {

});

ブロックして、DOM の準備が整うまで実行しないようにします。こちらのドキュメントを参照してください。

于 2012-05-22T10:03:39.780 に答える