獲取動態的子元素生成的內容與jQuery AJAX

我有以下標記：獲取動態的子元素生成的內容與jQuery AJAX

<div class="item-content" style="display: block;"> 
<div class="item-menu"> 
<div id="ajax-content-1" style="display: block; opacity: 0;"> 
<div class="content chapters current-tab"> 
<div class="right"> 
<div id="chapters-container-8" style=""> 
<div id="chapters-container-7" style="display: none"> 
<div id="chapters-container-6" style="display: none"> 
<div id="chapters-container-5" style="display: none"> 
<div id="chapters-container-4" style="display: none"> 
<div id="chapters-container-3" style="display: none"> 
<div id="chapters-container-25" style="display: none"> 
<div id="chapters-container-1" style="display: none"> 
</div> 
</div> 
</div> 
</div> 
</div>

這是一個Ajax的內容，我在頁面上幾個。因此，我想要做的是顯示第1章容器可見頁面上，如果我這樣做：

var first_div = $('div[id^=chapters-container-]:first'); 
first_div.show();

這是行不通的，因爲它顯示在頁面上所有可見章的容器div的，我希望它只顯示那個我加載的ajax-content的內容。我試圖做類似：

var first_div = $('#ajax-content-' + id).closest('div[id^=chapters-container-]:first'); 
first_div.show();

和

var first_div = $('#ajax-content-' + id).children('div[id^=chapters-container-]:first'); 
first_div.show();

而且doesnt't工作。順便說一句，我知道var id，所以它沒有錯誤。它根本不能很好地選擇我想要的東西。

來源

2012-03-01 Mythriel

請格式化您的問題中的代碼。 – epignosisx 2012-03-01 15:34:10

你沒有顯示任何結束標籤。使用'：first'，'closest（）'和'children（）'都會受到DOM結構的影響。確保您顯示的確切代碼包括結束標籤，否則我們只能猜測解決方案。 – 2012-03-01 15:38:27

您需要創建一個不在DOM中的jQuery元素，然後在那裏附加來自AJAX請求的內容，然後在那個元素上執行選擇。讓我來告訴你如何：

$.ajax({ 

// some ajax options etc. 

success: function(data) { 
    var container = $('<div>').apppend(data), 
    firstChapter = container.find('div[id^=chapters-container-]:first'); 
} 

});

這樣，你是在DOM元素外運行（這是更快BTW）和無論你想以後可以添加他們。

順便說一句，你可以給章容器一個類，更容易和更快的選擇。

來源

2012-04-12 23:38:08

獲取動態的子元素生成的內容與jQuery AJAX

回答

相關問題