Question

我正在使用包含更多Ajax的SilverStripe的页面。这是html结构

<div id="pagination"...>
    // items goes here
</div>
<div id="loadmore"...>
    // load more button
</div>

每当有一个Ajax调用时，#pagination div清空自己并附加响应数据。由于加载更多按钮需要更新链接，我将其包含在响应数据中（使用模板渲染）。

success: function(data) {
    loadmore.remove();
    container.empty();
    container.append(data);
}

然而，这导致了一个问题，即在Ajax之后，load more div嵌套在pagination div中。

任何想法我怎么能克服这个？

Answer 1

您可以将模板更改为：

<div id="wrapper">
    <div id="pagination"...>
        // items goes here
    </div>
    <div id="loadmore"...>
        // load more button
    </div>
</div>

然后做：

success: function(data) {
    $("#wrapper").replaceWith($(data));
}

如果您不想添加其他DOM节点，可以将回调处理程序重写为如下所示：

success: function(data) {
    var content = $(data);
    $("#pagination").replaceWith(content.filter("#pagination"));
    $("#loadmore").replaceWith(content.filter("#loadmore"));
}

使用Ajax加载更多DOM问题 - SilverStripe

1 个答案: