jquery點擊內容幻燈片圖片變化

$(".item_1").click(function(){ 
    var i =1; 
    if (i<=3){ 
    $("#slideshowWindow").wrapInner('<div class="slides" />'); 
    $('<img src="Content_Slide1/'+i+'.png" height="100%" width="100%"/>').appendTo($(".slides")); 
    i++ 
}

誰能告訴我我的代碼有什麼問題嗎？我想要的是我的html成爲如下：jquery點擊內容幻燈片圖片變化

<div id="slideshowWindow"> 
    <img id="Slide_image1" src="Content_Slide1/1.png" height="100%" width="100%" /> 
</div> 
<div class="slide"> 
    <img id="Slide_image2" src="Content_Slide1/2.png" height="100%" width="100%"/> 
</div> 
<div class="slide"> 
    <img id="Slide_image3" src="Content_Slide1/3.png" height="100%" width="100%"/> 
</div>

如果我把下面的html代碼相同，幻燈片放映的作品！然後，我刪除了所有div幻燈片類。使用上面我使用的Jquery代碼，嘗試通過點擊項目來更改幻燈片圖像組。

你有什麼想法我做錯了什麼？

<div class="Main" style="background-image:url(images/bg.jpg)"> 
    <div class="slide"><img></div> 
    <div class="slide"><img></div> 
    <div class="slide"><img></div> 
</div><!--/slideshowWindow-->

來源

2012-04-20 user1345581

闡明你的觀點和語言，請！ – thecodeparadox 2012-04-20 04:12:17

缺少語法，混合雙引號和單引號。一個'for'循環可能會更好... – elclanrs 2012-04-20 04:17:05

每次點擊'.item_1'時，它會將'i'重新設置爲1，所以它總是1，因此總是添加相同的圖像。 – CWSpear 2012-04-20 04:19:46

$(".item_1").click(function(){ 
    var i; 
    for (i = 1; i <= 3; i += 1) { 
    $("#slideshowWindow").wrapInner('<div class="slides" />'); 
    $('<img src="Content_Slide1/' + i + '.png" height="100%" width="100%"/>') 
     .append($(".slides")); 
    } 
});

這可能是你的目標是什麼了。（未測試）

編輯

我做了什麼，我想你你的編輯後想jsfiddle。我在jQuery中使用了appendTo方法。

EDIT 2

我已經更新了jsfiddle所以HTML輸出將匹配您的HTML輸出。

<div class="Main"> 
    <div class="slide"><img src="//lorempixel.com/400/400/abstract/1/" height="100%" width="100%"></div> 
    <div class="slide"><img src="//lorempixel.com/400/400/abstract/2/" height="100%" width="100%"></div> 
    <div class="slide"><img src="//lorempixel.com/400/400/abstract/3/" height="100%" width="100%"></div> 
</div>

注：我只是增加了一些文字給我追加的HTML。

請您正在使用的工具閱讀起來：jQuery，js

來源

2012-04-20 04:26:11 jlaceda

我試圖把它放在一個幻燈片播放器裏面，它仍然不能正常工作！只顯示第一張照片，所有其他照片都沒有顯示。任何想法？？非常感謝您的幫助 – user1345581 2012-04-20 05:43:55

在jsfiddle中，您可以嘗試將「.slides」選擇器替換爲要將圖像放入的位置。幻燈片持有者的選擇器是什麼？ http://api.jquery.com/category/selectors/ – jlaceda 2012-04-20 06:11:14

jquery點擊內容幻燈片圖片變化

回答

相關問題