級火災兩次

你好：我想知道是否有可能讓下面的圖像一次下拉一個。目前，當第一個點擊時它們都會立即下降。我試過使用removeClass但沒有任何結果。級火災兩次

該代碼出現兩次，因爲我試圖顯示兩個圖像。兩者最初都是縮略圖，如果這個人有興趣，他們會點擊並顯示一個更大的圖像。一旦完成觀看，他們可以點擊並移除圖像，然後看圖2，並有相同的機會。如果他們想看到大於縮略圖的東西，他們會點擊它。問題是，點擊第一個（或第二個）縮略圖時，兩個較大的圖像立即展開，然後再次縮小。我希望這很清楚，如果需要，我可以嘗試進一步澄清。由於

<div class="JQuery"><!--Begin JQuery--> 
<div class="clickMeA"><img src="images/1.jpg" width="124" height="90" /></div> 
<div class="picframeA"><img src="images/1LG.jpg"><p>Here is the text</p></div> 
    <script src="jquery-1.7.2.min.js"></script> 
    <script> 
    $(document) .ready(function(){     
      $(".clickMeA"). click(function() {            
      $("img") .fadeIn(1000); 
      $(".picframeA") .slideToggle("slow"); 
     }); 
    }); 
    </script> 
<div class="clickMeA"><img src="images/2.jpg" width="124" height="90" /></div> 
<div class="picframeA"><img src="images/2LG.jpg"><p>Here is the text</p></div> 
    <script src="jquery-1.7.2.min.js"></script> 
    <script> 
    $(document) .ready(function(){     
      $(".clickMeA"). click(function() { 
      $("img") .fadeIn(1000); 
      $(".picframeA") .slideToggle("slow"); 
     }); 
    }); 
    </script> 
</div>

來源

2012-05-17 officemanager2

看樣子你是缺少一些輔助代碼段。 –

同意@RobLowe。您需要顯示相關的HTML代碼並清楚地描述您的問題。此外，不清楚你的js代碼的雙重發布，澄清你爲什麼這樣做。 –

$(".clickMeA")

這得到所有元素與類clickMeA。

$("img")

這得到網頁上的所有<img>標籤。

你只需要包含你的腳本和jQuery 一次。你應該把你的腳本放在你的<head>中，你需要複製&在每個div後面粘貼整個腳本。

該腳本直到DOM準備好，所以你只需要它一次，它會影響所有匹配的元素。

$(document).ready(function(){ // runs after the DOM is ready 
    $(".clickMeA").click(function(){ // gets all elements with that class 
     // why are you fading in before sliding the div? 
     $(this).next(".picframeA").find("img").fadeIn(1000); // target the correct image 
     $(this).next(".picframeA").slideToggle("slow"); // target the correct div 
    }); 
});

演示：http://jsfiddle.net/yngEQ/1/

來源

2012-05-17 21:35:36

感謝您的這一點，我可以看到我錯過了很多工作。你對閱讀/評論有什麼建議可以填補我所缺失的概念。我遇到過'this'的用法，但不理解概念 – officemanager2

@ officemanager2：我無法真正提出任何建議，對不起。只是谷歌我猜。 –

夠好。如果你有時間，我試圖複製你在上面的鏈接上做了什麼，但出於某種原因，我無法獲得新的頁面。如果我從上面的鏈接中複製並粘貼了所有內容，並且包含jquery-1.7.2.min.js的鏈接，是否還有什麼遺漏會阻止擴展到更大的圖像？ – officemanager2

回答

相關問題