jQuery：我可以自動將插件應用於動態添加的元素嗎？

我正在將我的web應用程序轉換爲完全的AJAX體系結構。jQuery：我可以自動將插件應用於動態添加的元素嗎？

我有我最初加載的母版頁和加載了動態內容的div容器。

我創建了幾個jQuery插件，我將其應用於某些元素以擴展其功能。我通常調用的函數每個頁面加載過程如下：

$(document).ready(function() { 

    // Enable fancy AJAX search 
    $(".entity-search-table").EntitySearch(); 

});

這將找到合適的div（S），並調用插件來實現必要的功能。

在AJAX環境中，我不能在頁面加載時應用插件，因爲元素將被動態地添加和刪除。

我想要做這樣的事情：

$(document).ready(function() { 

    // Enable fancy AJAX search 
    $(".entity-search-table").live("load", function() { 
     $(this).EntitySearch(); 
    }); 

});

問：是否存在時選擇相匹配的<div>或其他元素添加到DOM，我可以觸發事件的任何方式？

每次AJAX請求完成時激活插件似乎令人難以置信的浪費。插件僅在第一次添加到DOM時才需要應用到該元素。

感謝您的幫助！

來源

2010-12-06 Lucifer Sam

你可能已經有你的架構正在進行，但如果你不這樣做，我會爲我的[AJAXFetch jQuery插件]（http://phrogz.net/JS/AJAXFetch/）插入一個插件，它使用標記以允許您自動在頁面上執行各種AJAX風格的交換。 – Phrogz 2010-12-06 03:30:10

是的 - 看看liveQuery。例如：

$('.entity-search-table').livequery(function(){ 
    $(this).EntitySearch(); 
});

來源

2010-12-06 03:16:57 karim79

這綁定到每個的加載事件，你需要* only *`$（this）。EntitySearch（）;`作爲處理程序的主體:) – 2010-12-06 03:21:31

@Nick - 這就是我從我從未使用過的東西中創建一個示例所得到的結果：S – karim79 2010-12-06 03:23:36

使用住在你的插件代碼中直接

 jQuery.fn.EntitySearch = function() { 
    this.live(..., function(){ your plugin code }); 
    return this; 
}

來源

2010-12-06 03:18:03 Jaime

這似乎令人難以置信的浪費每一個AJAX請求完成的時間來激活插件綁定。插件僅在第一次添加到DOM時才需要應用到該元素。

你可以得到兩全其美的位置，例如：

$("#something").load("url", function() { 
    $(".entity-search-table", this).EntitySearch(); 
});

這樣，它的唯一應用插件，您只是加載的.entity-search-table元素，因爲我們指定的上下文$(selector, context)限制它。

來源

2010-12-06 03:20:53

DOM 2 MutationEvent是你真正想要的，但不幸的是它不被IE支持。您需要在插件中使用live()/delegate()綁定，或者（正如我在解決此問題時所做的那樣）使用來自AJAX加載器的回調來指示已更改的範圍。

來源

2010-12-06 03:27:52 Phrogz

jQuery：我可以自動將插件應用於動態添加的元素嗎？

回答

相關問題