從iframe動態創建元素的事件綁定

在我的應用程序中，添加了將div元素動態添加到其父div元素的代碼。我可以通過使用$('#FrameId').contents().find('#id');訪問預定義的iframe div元素。但是，當我嘗試獲得最新追加的div元素，那麼它顯示undefined。爲什麼我無法訪問新添加的div元素？從iframe動態創建元素的事件綁定

對於追加新的div元素，下面的代碼使用：

$('#frameId').contents().find("#id").append("<div class="sample">Some text</div>");

當我試圖讓新加入的div元素，下面的代碼中使用：其中

$('#frameId').contents().find(".sample").click(function(){});

，單擊事件不會被觸發，因爲它無法找到.sample div元素。

來源

2017-06-15 Nijandhan

推動這些代碼到負載的功能$（ '＃frameId'）內。負載（函數（）{$（本）.contents（）。查找（「＃ID」）。追加（」（）。）; $（this）.contents（）。find（「。sample」）。click（function（）{}）;}）; – JYoThI

你是否檢查過新元素被附加到DOM？ –

[Delegate]（http://api.jquery.com/delegate），將一個處理程序附加到匹配選擇器的所有元素的一個或多個事件，**現在或將來**，基於特定的一組根元素。 – Munzer

您可以使用iframe load活動，請在下面的示例中找到更多信息。

而動態創建的元素上點擊事件，你必須創建使用on().

一個「委託」結合

委託事件有優勢，他們可以處理來自被添加到後代元素事件該文件在稍後的時間。

$('#frameId').on('load', function(){ 
    $(this).contents().find('body').on('click', '.sample', function(e){ 
     //Do some stuff 
    }); 
});

來源

2017-06-15 12:22:29 Curiousdev

試過這個代碼，但它不工作。我認爲新添加的元素沒有附加到DOM元素。當我嘗試獲取新添加的元素時，我無法獲取它。但我嘗試使用在iframe中添加的相同的html代碼，我可以得到它。任何想法？ - @Curiousdev – Nijandhan

使用委託事件後，它工作正常。 – Nijandhan

從iframe動態創建元素的事件綁定

回答

相關問題