jQuery show（）在hide（）後不工作（）

Question

我試圖在點擊圖像後顯示帶有內容的div，但是當我的頁面被加載後，我嘗試點擊，則沒有任何反應。有趣的是，如果我的頁面正在加載不隱藏的內容，然後我會隱藏（）和show（）id控制檯後，它完美的作品。我究竟做錯了什麼？

$(document).ready(function() { 
$('.content-flowers').hide() 

var first = $(".content-flowers").children()[0]; 
var second = $(".content-flowers").children()[1]; 
var third = $(".content-flowers").children()[2]; 

var firstImg = $(".flower-image")[0]; 
var secondImg = $(".flower-image")[1]; 
var thirdImg = $(".flower-image")[2]; 

$(firstImg).click(function(){ 
$(first).toggle(1000); 
}) 

/*$(".flower-image").click(function() { 
$('.content-flowers').show(1000); 
});*/ 

}); 

最新評論功能工作也不錯，但函數加載所有三個的div的內容，我想以點擊1張圖像後內容的第一個div將顯示

Answer 1

你說註釋版本的作用不同於它同時執行全部三個版本，但早期版本不起作用。

他們做了非常不同的事情。您未註釋掉的代碼看起來在孩子.content-flowers元素：

var first = $(".content-flowers").children()[0]; 

但你註釋掉的版本適用於.content-flowers元素本身：

$('.content-flowers').show(1000); 

我懷疑它是.children()部分是使它失敗。我想你想：

var first = $(".content-flowers")[0]; 
// No .children() here ----------^ 

...作爲最小的變化。

這就是說，雖然，整個事情可以大大簡化：

$(document).ready(function() { 
    $('.content-flowers').hide() 

    // Get the flower images 
    var images = $(".flower-image"); 

    // When a flower image is clicked...  
    images.on("click", function() { 
     // Determine its index relative to the others... 
     var index = images.index(this); 

     // And show that content 
     $(".content-flowers").eq(index).toggle(1000); 
    }); 
}); 

Answer 2

您已經在變量第一次採用了jQuery函數。所以請先嚐試一下。（1000）。刪除$符號。