如何在滚动或滚动时获取更多JSON数据？

我有下面的代码，当用户搜索一个术语时返回一些结果。一旦我得到了一些结果，我想添加功能，让我得到更多的数据时，向下滚动病房？如何在滚动或滚动时获取更多JSON数据？

注意：我不想使用任何插件（s）。

$(document).ready(function() { 
     $("#submit").click(function (event) { // wire up this as an onclick event to the submit button.     
        var searchTerm = $("#search").val(); // get the user-entered search term 
        var URL = "http://api.flickr.com/services/feeds/photos_public.gne"; 
        //var URL = "http://api.flickr.com/services/feeds/photos_public.gne"; 
        var ID = "[email protected]"; 
        //var MYID-"[email protected]"; 
        //var tagmode="&tagmode=any"; 
        //var format ="&format=json"; 
        var tags="&tags="+ searchTerm; 
        var tagmode="&tagmode=any"; 
        var jsonFormat = "&format=json&jsoncallback=?";     
        var ajaxURL= URL+"?jsoncallback=?id="+ID+tags+tagmode+jsonFormat; 
        //var ajaxURL= URL+"?"+tags+tagmode+jsonFormat; 

        $.getJSON(ajaxURL,function(data){ 
        //$("h1").text(data.title); 
        //alert(data.length); 

        var photoHTML; 
        $("#photos").empty(); 
         if (data.items.length) { 
          alert(data.items.length); 

          $.each(data.items, function(i,photo) { 

          //var photoHTML = "<h4>" +photo.tags + "</h4>"; 
          photoHTML = "<p>"; 
          photoHTML += '<a href="' + photo.link + '">'; 
          photoHTML += '<img src="' + photo.media.m + '" alt="' + photo.media.m + '" title="' + photo.media.m + '"></a>'; 
          photoHTML = "</p>"; 
          $('#photos').append(photoHTML).fadeIn(200); 
                 }); 

         } else { 
          alert(data.items.length); 
          photoHTML = "<h2> No Results</h2>"; 
          $('#photos').append(photoHTML).fadeIn(200); 
         } 
         //$('#photos').append(photoHTML).fadeIn(200); 

       }); 



      });   
});

来源

2013-09-27 user244394

您也可以绑定滚动事件使用jQuery：

把你的整个代码到一个函数：

function myfun(){ 
//-- you code 
}

，并呼吁从两个事件myfun()：

上点击事件 -

$("#submit").click(function (event) { 
    myfun(); 
});

上滚动事件 -

$("#yourSelector").scroll(function(){ 
     myfun(); 
    });

来源

2013-09-28 14:26:16

您可以使用jquery .scroll（）方法。您有两个选项，当页面加载时保存所有数据，然后以用户滚动显示或每次有向下滚动请求时发出ajax请求。

$("#yourSelector").on('scroll', function(){ 
    // do stuff 
});

，或者干脆利用快捷键：

$("#yourSelector").scroll(function(){ 
    // do stuff 
});

我希望这有助于！

这里是jQuery的滚动API链接了解的选项（如指定向下滚动）：http://api.jquery.com/scroll/

来源

2013-09-27 22:12:25 Ricanare

如何在滚动或滚动时获取更多JSON数据？

回答

相关问题