jQuery不適用於動態生成的div

我正在創建一個使用Flickr的REST API的網站的投資組合部分。然而，投資組合項目清單是由此代碼動態生成的：jQuery不適用於動態生成的div

$.ajax({ 
    url: "https://api.flickr.com/services/rest?method=flickr.photoSets.getList&user_id=********@N04&format=json&nojsoncallback=1&api_key=***********", 
    context: document.body 
}).done(function(results) { 
    results.photosets.photoset.map(function(item) { 
    var imgUrl = "https://farm" + item.farm + ".staticflickr.com/" + item.server + "/" + item.primary + "_" + item.secret + "" + ".jpg"; 
    $(" #portfolio_horizontal_container ").append(
     '<div class="portfolio_item interior design"> \ 
      <img src=' + imgUrl + ' alt="" /> \ 
      <div class="port-desc-holder"> \ 
       <div class="port-desc"> \ 
        <div class="grid-item"> \ 
         <h3><a href="folio-single">Quisque non augue</a></h3> \ 
         <span>Photography/ Web design</span> \ 
        </div> \ 
       </div> \ 
      </div> \ 
     </div>' 
    ) 
    }) 
});

我還有另一個管理投資組合交互和風格的插件。然而，當投資組合項目的DOM元素被加載時，這些其他插件不起作用，因此它應用於投資組合的功能是不存在的。我試圖解決這個問題並沒有成功。任何雖然？

來源

2016-04-12 Luis Dos Reis

你是什麼意思*做「的jQuery是行不通的」 *事件？這對我來說看起來不合適。控制檯中有錯誤嗎？ –

編輯..沒有控制檯錯誤。 –

添加內容後，應該初始化插件。你如何/何時初始化這些？ –

將新元素添加到頁面時，需要重新運行將事件處理程序附加到DOM元素的代碼。

在與上面相同的功能中，您需要重新調用插件，以便它知道新結構。

來源

2016-04-12 15:55:22 Mark

我這樣做沒有成功。 –

我這樣做沒有成功。但你是正確的，這是應該做的。問題是我有兩個文件。 scripts.js和plugins.js。在腳本和腳本設置插件的配置之前，插件會被加載。我甚至試圖把這兩個文件的所有代碼放在ajax回調裏面，在地圖之後，沒有成功。它會被加載，但如果我在歷史中來回回放，它只會初始化 –

如果我明白你的問題，你可以創造出創建活動的功能，並調用它在完成了ajax：

function bindEvent(id){ 
     //initialize the plugin for the given id 
    }

，那麼你可以調用bindEvent，使用的ajax.done內追加後新插入的html的id。

或

如果它是你要綁定你可以使用

$('body').on('click', 'my-dinamic-id', function(){...})

來源

2016-04-12 17:24:42

jQuery不適用於動態生成的div

回答

相關問題