如何動態更改div內容後應用jQuery擴展器？

我有一些div的內容。 jQuery擴展器應用於它。過了一段時間，div的內容通過ajax調用進行更改。我怎樣才能申請擴展器的div在jQuery的.done（）再次？如何動態更改div內容後應用jQuery擴展器？

$(document).ready(function(){ 
    $('div.expandable').expander({ 
    slicePoint: 200, 
    preserveWords: true, 
    widow: 4, 
    expandText: 'continue reading', 
    detailClass: 'expanderDetails', 
    afterExpand: function(){ 
     $('#mybutton').click(); //simulate a different click. 
    } 
});

div.expandable的內容被ajax請求改變。一旦發生，我正在失去「Read More」功能。我想通過request.done（）將擴展器效果應用回div。如何實現這一目標？只要運行這個不起作用：

$('div.expandable').expander();

來源

2013-07-02 DS.

你嘗試把它放在一個函數並調用它每次換做？ –

這可能會有所幫助：http://stackoverflow.com/questions/6617547/how-can-i-get-jquery-live-and-expander-to-function-properly-together – showdev

這是我能找到的唯一相關問題不幸的是它沒有幫助。因此，新的問題。必須有一種超級簡單的方式來重新連接膨脹機。 –

首先，你應該換你擴展的代碼放到一個函數：

function initExpander() { 
    $('div.expandable').expander({ 
     slicePoint: 200, 
     preserveWords: true, 
     widow: 4, 
     expandText: 'continue reading', 
     detailClass: 'expanderDetails', 
     afterExpand: function(){ 
      $('#mybutton').click(); //simulate a different click. 
     } 
    }); 
}

然後你就可以在每次需要初始化擴展時使用此功能，例如在DOM加載後：

$(document).ready(function() { 
    initExpander(); 
});

或者Ajax調用之後：

$.ajax({ 
    url: '/doajax', 
    // .... your ajax request here 
    success: function() { 
     initExpander(); 
    } 
});

如果您使用的是（）完成與AJAX，它太細：

$.ajax({ 
    url: '/doajax', 
    // .... your ajax request here 
}).done(function() { 
    initExpander(); 
});

希望這有助於;）

來源

2013-07-04 15:22:25

感謝您的支持！在我的情況下，我不得不打開不同的AJAX檢索內容彈出窗口。如果我成功添加initExpander（）：它僅適用於第一個彈出窗口。想法？ – Daviddd

嗯，很難想象它是如何工作的，理想情況下你可以發佈一個問題並將其鏈接到這裏，然後我可以看一看嗎？ –

如何動態更改div內容後應用jQuery擴展器？

回答

相關問題