如何使用.done()回调为请求中加载的新数据运行函数?

时间:2018-08-31 14:13:08

标签: javascript jquery ajax

我有一个页面显示json提要中的数据,并且我还有一个按钮,单击按钮即可加载更多提要。我的目的是在页面内为每个提要项添加一些内容。我已经能够创建一个在页面加载时执行此操作的函数,但是我不确定如何通过异步加载更多数据来实现此功能。

我知道我需要使用.done()回调函数来完成这项工作,但需要一些有关如何正确实现的指导。

此功能最初会添加新内容:

function appendFeed() {
$('.feed__item').each(function (index) {
$feedItem = $('.feed__item', $(this));
$feedItem.append('<div class="feed-gallery"></div>');

for (var i = 1; i <= 5; i++) {
var $count = i;
if ($count > 1) {
$('.feed.gallery', $(this)).append('<div><img data-lazy="//placehold.it/50x50"></div>');
};
});
}

单击按钮,即会引用.done()回调:

$('button').click(function(){
        $.getJSON(uri, function (json, textStatus) {
          // do stuff
        }).done(function (json) {
         // do stuff - in my case this would be appendFeed() 
        });
});

我已经调用了appendFeed()函数,但是如果我将其放在单击按钮的.done()回调中,那么它将再次追加提要。如何防止页面上的提要重复?

1 个答案:

答案 0 :(得分:0)

这就是你的写作方式。

   <script type="text/javascript">
      $.getJSON("/waqar/file.php").done(function (data) {
        $(".output").append(data);
      });
    </script>