JQuery的條件語句不工作

這裏是我的代碼：JQuery的條件語句不工作

// JavaScript Document 
$(document).ready(function() { 
row[1] = false; 
row[2] = false; 
row[3] = false; 
row[4] = false; 
row[5] = false; 
row[6] = false; 
$('.row1bback').fadeOut(0); 
$('.row2bback').fadeOut(0); 
$('.row3bback').fadeOut(0); 
$('.row4bback').fadeOut(0); 
$('.row5bback').fadeOut(0); 
$('.row6bback').fadeOut(0); 
function rowrfade() { 
    var rRow = Math.ceil(Math.random() * 6); 
    var rDelay = (Math.ceil(Math.random() * 20)) * 1000; 
    rowfade(rRow, rDelay); 
} 
function rowfade(rRow, rDelay) { 
    if (row[rRow] == false || row[rRow] == "") { 
     $('.row'+ rRow + 'aback').delay(rDelay).fadeOut(10000); 
     $('.row'+ rRow + 'bback').delay(rDelay).fadeIn(10000); 
     return row[rRow] = true; 
     rowrfade(); 
    } else if (row[rRow] == true) { 
     $('.row'+ rRow + 'aback').delay(rDelay).fadeIn(10000); 
     $('.row'+ rRow + 'bback').delay(rDelay).fadeOut(10000); 
     return row[rRow] = false; 
     rowrfade(); 
    } 
} 
    //row1fade(); 
    rowrfade(); 
});

我想隨機隱藏/顯示1 2的圖片6行。我試圖理解什麼是最好的方法是使這個功能的工作。

我想檢查哪個圖片顯示爲隨機行稱爲。如果它是圖片a（value = false）或圖片b（value = true）。如果顯示圖片a，則淡出圖片a併爲該行顯示圖片b。這個循環將不斷重複和循環。

這裏是我的HTML代碼：

<div class="mframe"> 
    <div class="row1aback"> 
    </div> 
    <div class="row1bback"> 
    </div> 
    <div class="row2aback"> 
    </div> 
    <div class="row2bback"> 
    </div> 
    <div class="row3aback"> 
    </div> 
    <div class="row3bback"> 
    </div> 
    <div class="row4aback"> 
    </div> 
    <div class="row4bback"> 
    </div> 
    <div class="row5aback"> 
    </div> 
    <div class="row5bback"> 
    </div> 
    <div class="row6aback"> 
    </div> 
    <div class="row6bback"> 
    </div> 
</div>

我的圖片所使用的背景圖片的CSS屬性。我也只有6行，每行2個圖像。默認情況下，我顯示第一個圖像，並使用JS隱藏第二個圖像。然後我隨機選擇一行，並在1到20秒之間選擇一個隨機延遲。然後我使用它來改變隨機選取的行中的圖片。我使用延遲來使效果看起來是隨機發生的。

我已經改變了我的代碼，並使用以下條件語句來使此函數正常工作。讓我知道如果你知道另一種使它工作的方式。

謝謝。

// JavaScript Document 
$(document).ready(function() { 
$('.row1bback').fadeOut(0); 
$('.row2bback').fadeOut(0); 
$('.row3bback').fadeOut(0); 
$('.row4bback').fadeOut(0); 
$('.row5bback').fadeOut(0); 
$('.row6bback').fadeOut(0); 
function rowrfade() { 
    var rRow = Math.ceil(Math.random() * 6); 
    var rDelay = (Math.ceil(Math.random() * 10)) * 1000; 
    var fTimer = 6500; 
    rstatus = $('.row' + rRow + 'aback').css('display'); 
    if (rstatus == 'block') { 
     $('.row'+ rRow + 'aback').delay(rDelay).fadeOut(fTimer); 
     $('.row'+ rRow + 'bback').delay(rDelay).fadeIn(fTimer, 
     function() { 
      rowrfade() 
     }); 
    } else if (rstatus == 'none') { 
     $('.row'+ rRow + 'aback').delay(rDelay).fadeIn(fTimer); 
     $('.row'+ rRow + 'bback').delay(rDelay).fadeOut(fTimer, 
     function() { 
      rowrfade() 
     }); 
    } 
} 
rowrfade(); 
});

來源

2011-10-11 8BallDZigns

你需要利用淡入淡出和回調，使這項工作正常，這樣的項目不開始褪色的下一個項目開始淡出之前。

以這種方式存儲數組不是很有伸縮性。在我的示例中，我將所有行存儲在jquery對象中，並跟蹤當前行。

既然你只有兩張圖片，我已經隱藏了一個孩子，然後根據它是否可見，計算出哪一個可以淡入或淡出。如果你使用兩個以上的項目，你將不得不調整這一點。

我希望這會有所幫助。

<html> 
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function() { 
    var current = 0; 
    var $rows = $('.row'); 

    $rows.each(function() { 
     $(this).children(':last').hide(); 
    }); 

    function fade() { 
     var newRow = null; 
     do { 
      newRow = Math.floor(Math.random() * $rows.length); 
     } while(newRow === current);  

     var $row = $rows.eq(current); 
     var $hide = $row.children(':visible'); 
     var $show = $row.children(':not(:visible)'); 

     $hide.fadeOut('slow'); 
     $show.fadeIn('slow', function() { 
      current = newRow; 
      fade(); 
     }); 
    } 

    fade(); 
}); 

</script> 
<div class="row">1: <span>A</span><span>B</span></div> 
<div class="row">2: <span>A</span><span>B</span></div> 
<div class="row">3: <span>A</span><span>B</span></div> 
<div class="row">4: <span>A</span><span>B</span></div> 
<div class="row">5: <span>A</span><span>B</span></div> 
<div class="row">6: <span>A</span><span>B</span></div> 
</html>

來源

2011-10-11 03:26:35

我是故意將圖像淡入淡入淡出狀態，這是爲了創建一張圖片同時溶入另一張圖片。 – 8BallDZigns

那麼你只需在回調下移動fadeIn即可。儘管您可能希望在回調中保留遞歸調用，所以在淡入完成之前它不會啓動另一行。您還需要弄清楚如何獲得定位權，讓他們坐在彼此之上。 –

我更新了下面的文字。對於每一行，我都試圖在兩張圖像之間淡入淡出。您的代碼將逐個淡入所有6張圖像。我需要檢查每行顯示哪個圖像的狀態，然後基於此執行淡入淡出。 – 8BallDZigns

JQuery的條件語句不工作

回答

相關問題