Question

我正在使用getJSON从facebook页面api获取数据，使用此代码它可以正常工作：

      $(document).ready(function(){

    $.getJSON('url',function(json){

        $.each(json.data,function(i,fb){

           var output='';

        //here I add to output, as this example line:


            output += '<div"><a href="http://www.facebook.com/profile.php?id='+fb.from.id+'>'+fb.from.name+'</a>';


           $("#results").append(output);

    });
});

然而，我想做的事情类似于facebook在其社交插件中所做的事情，它以5个条目开始并且有一个Show More链接，点击后会带来5个以上的条目。

有没有办法通过改变我的代码来做到这一点？

由于

Answer 1

嗯，确定有。当用户点击“更多链接”以节省带宽时，是否要获取其他结果？或者可以同时获取？ （async vs sync）

这个答案考虑粗体文字：

output += '<div' + (i >= 5 ? ' style="display: none;"' : '') + '><a href="http://www.facebook.com/profile.php?id=' + fb.from.id +'>'+fb.from.name+'</a></div>';

哦，并检查代码中的那一行，你有一个语法错误和一个不匹配的div。您还应该在HTML元素的属性周围加上引号。

为了在点击更多链接时显示链接，您可以执行以下操作：

$('.more').click(function() { $(this).hide(); // Find the closest ancestor which is a parent of both // the more link and the actual results list var $parent = $(this).closest('.parentSelector'); $('.listSelector', $parent).children().show(); return false; // Don't follow the link });

具有上述父项的部分适用于在同一页面上有多个此类结果列表且需要将它们分开的情况。如果您不需要它，这里有一个更简单的变体：

$('.more').click(function() { $(this).hide(); $('#results').children().show(); // Show all other list items return false; // Don't follow the link });

GetJSON并使用Show More链接

1 个答案: