0

これは、div が非表示で && に「ビュー」のクラスがあるかどうかを確認するための正しい jQuery 構文ですか? もしそうなら、.3秒後にクラス「ビュー」で次の隠しdivを明らかにしますか?

ただし、現在は機能していないことに注意してください。クラスに関係なく、すべての非表示の div がフェードインします。

<script type="text/javascript">
            $(function() {
                // Start showing the divs
                showDiv();
            });

            function showDiv() {
                // If there are hidden divs left
                if($('div:hidden').length.hasClass('view')) {
                    // Fade the first of them in
                    $('div:hidden:first').fadeIn();
                    // And wait one second before fading in the next one
                    setTimeout(showDiv, 300);
                }
            }
    </script>
4

4 に答える 4

4

おそらくより良い解決策は

if($('div.view:hidden').length) {
  // Fade the first of them in
  $('div.view:hidden:first').fadeIn();
  // And wait one second before fading in the next one
  setTimeout(showDiv, 300);
}
于 2012-07-09T21:09:42.543 に答える
2 
// get all hidden divs with a class of view
var $hiddenViewDivs = $('div.view:hidden');
// if there are any...
if ($hiddenViewDivs.length) { 
    // get the first one and invoke fadeIn() on it
    $hiddenViewDivs.first().fadeIn(); 
    // And wait one second before fading in the next one
    setTimeout(showDiv, 300);
}

あなたのコードが何をしていたかを説明します (私の新しいコメントを星で囲んでください):

// **Get the length (count) of all hidden divs and invoke hasClass('view') on that number (will throw an error)**
if($('div:hidden').length.hasClass('view')) {
    // **Get the first hidden div and invoke fadeIn() on it, regardless of if it has a class of view or not**
    $('div:hidden:first').fadeIn();
    // And wait one second before fading in the next one
    setTimeout(showDiv, 300);
}

編集（代替ソリューション）：

$('div.view:hidden')このソリューションの利点は、DOM で探し続ける必要がないことです。ここでは、一度それを手に入れて、パフォーマンスの神々をなだめます.

function showDiv() {
    var $hiddenViewDivs = $('div.view:hidden');
    var i = 1;
    $hiddenViewDivs.each(function(){
        (function($target){ 
            setTimeout(function(){$target.fadeIn();}, 300*i);
        })($(this));
        i++;
    });
}​

例: http://jsfiddle.net/lbstr/LdzYm/

于 2012-07-09T21:09:54.173 に答える
0

どう$('div.view:hidden').lengthですか？

于 2012-07-09T21:10:31.533 に答える
0 
$('div.view:hidden:first').fadeIn(function() {
   setTimeout(showDiv, 300); 
});

if は必要ありません。jQuery がそれを処理します。

于 2012-07-09T21:32:28.017 に答える