來自Jquery的HTML響應不適用於javascript

Question

我發現很多與此問題類似的帖子，但我認為我做錯了，因為我沒有將javascript放在ajax調用的響應中。

基本上，ajax返回放置在div內的純html。 該div位於我的頁面內部，並且該頁面已經包含對CSS和javascript文件的引用。

在其中的一個javascript文件中，我嘗試呈現由ajax調用返回的按鈕，以使用jQuery ui函數看起來不錯，所以基本上我要做的就是

$(".ButtonClass").button();

這段代碼在document.ready函數中，ajax返回的html包含所有按鈕的“ ButtonClass”。

.button()適用於返回的ajax html外部的按鈕，但不適用於ajax調用返回的元素。

我認為它應該工作，因為將CSS樣式應用於結果，但是我無法獲得任何功能來處理結果，我重復一遍，我不返回javascript代碼，我將此代碼保存在整個頁面中引用的外部文件中。

Answer 1

如果要為AJAX請求返回的元素啟用按鈕，則應在收到響應時再次執行它。

.button()在調用時已選擇的元素上執行-在發出AJAX請求之前調用時不包括AJAX元素。

請注意， $(".ButtonClass")也將包含以前的.ButtonClass元素，因此它們將兩次轉換為按鈕。 您只需要從AJAX響應中選擇一個即可。

Answer 2

嘗試致電

$(".ButtonClass").button();

在ajax回調中。

Answer 3

我認為當ajax調用成功終止時，您需要應用裝飾器函數。 遵循以下原則：

$('#myelement').load('script.php', function() {

   // Now the page has some more button to decorate:
   $(".ButtonClass .ugly").button().removeClass('ugly'); 

});

如您所見，我在新按鈕上添加了“丑陋”類，以免重新美化存在的美麗按鈕:)

Answer 4

每次在應為按鈕的頁面中引入新標記時，都必須調用.button（）函數。 您可以在.ready（）上正確執行此操作，但也應該在ajax調用的成功函數上執行此操作。

Answer 5

填充div后，您將必須初始化這些按鈕。

例如，如果您的div存儲在名為$container的javascript變量$container ，則在將內容添加到頁面后，運行代碼$('.ButtonClass',$container).button() 。

Answer 6

在您的Ajax回調中，執行$(".ButtonClass").button(); 再次。