Question

我有一些内容的div。 jQuery扩展器应用于它。过了一会儿，div的内容通过ajax调用改变了。如何在jquery .done（）中再次将扩展器应用于div？

$(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请求更改。一旦发生，我就失去了“阅读更多”功能。我想将扩展器效果应用于request.done（）上的div。怎么做到这一点？只是运行它不起作用：

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

Answer 1

首先，您应该将扩展器代码包装到函数中：

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的done（），那也没关系：

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

希望这会有所帮助;）

如何动态更改div内容后应用jQuery扩展器？

1 个答案: