爲什麼不通過HTML元素循環jQuery腳本？

我通過一系列HTML元素的條件上點擊鼠標即事件序列要循環是：裏面的div 2.點擊的div 3.顯示下一個元素 4.點擊 5.顯示器上 1顯示元件下一個元素 ....等從最終元件背面 6.循環到第一元件爲什麼不通過HTML元素循環jQuery腳本？

我已經創建了下面的代碼，但下一個元素例如ID =「圖像」不替換當前元素。這是爲什麼？請參閱下面的HTML，CSS和JS。

<div class="frame" id="title">CULTURAL</div> 
<div class="frame" id="image"> 
    <img class="topLeft" src="images/zanzibar_market_1.jpg" alt="Zanzibar Cloth"> 
</div> 
<div class="frame" id="text">A culture encompasses the ideas, customs, and social behaviour of a people or society. 
    When we mix with other cultures we are enriched by the experience. We know more of the world.</div> 

.frame { 
    margin: auto; 
    width: 300px; 
    height: 300px; 
    border: 1px solid skyblue; 
} 
#title { 
    font-size: 2em; 
    opacity: 1.0; 
} 
#image { 
    opacity: 0.0; 
} 
#text { 
    opacity: 0.0; 
} 

var frames = document.getElementsByClassName("frame"); 

for(var i=0; i<frames.length; i++){ 
    $("frames".eq(i)).click (function() { 
     $("frames".eq(i)).animate({ 
      opacity: 0.0 
     }); 
     var x = i + 1; 
     $("frames".eq(x)).animate({ 
      opacity: 1.0 
     }); 
    }); 
};

來源

2016-12-30 Trevor

這些選擇都是錯誤的：

$("frames".eq(i))... 
$("frames".eq(x))...

應該是：

$(".frame").eq(i)... 
$(".frame").eq(x)...

和你的最後一個元素的邏輯缺失。您可以嘗試類似：

var x = (i + 1) % frames.length;

來源

2016-12-30 21:47:47 Shomz

它實際上是'.frame'，不'frames'。 – Ionut

@Ionut，謝謝！ – Shomz

我現在有：var frames = document.getElementsByClassName（「frame」）;對於（var i = 0; i Trevor

爲什麼不通過HTML元素循環jQuery腳本？

回答

相關問題