// 数据格式
var testJson = {
"status":1,
"Daten":[
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x300/B5E61D/fff","width":240,"height":300,"name: „图片1“},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x210/333/fff", "width":240, "height":210, "name"":"图片2"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x190/f60/fff","width":240,"height":190,"name":"图片3"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x230/B5E61D/fff","width":240,"height":230,"name":"图片4"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x280/B5E61D/fff","width":240,"height":280,"name":"图片5"},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x260/eee/fff", "width":240, "height":260, "name"":"图片6"},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x180/000/fff", "width":240, "height":180, "name"":"图片7"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x240/B5E61D/fff","width":240,"height":240,"name":"图片8"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x265/B5E61D/fff","width":240,"height":265,"name":"图片9"},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x245/259/fff", "width":240, "height":245, "name"":"图片10"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x310/B5E61D/fff","width":240,"height":310,"name":"图片11"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x210/B5E61D/fff","width":240,"height":210,"name":"图片12"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x150/B5E61D/fff","width":240,"height":150,"name":"图片13"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x165/B5E61D/fff","width":240,"height":165,"name":"图片14"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x100/B5E61D/fff","width":240,"height":100,"name":"图片15"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x280/B5E61D/fff","width":240,"height":280,"name":"图片16"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x225/B5E61D/fff","width":240,"height":225,"name":"图片17"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x210/B5E61D/fff","width":240,"height":210,"name":"图片18"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x230/B5E61D/fff","width":240,"height":230,"name":"图片19"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x210/B5E61D/fff","width":240,"height":210,"name: „图片20“},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x300/B5E61D/fff","width":240,"height":300,"name":"图片21"},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x210/333/fff", "width":240, "height":210, "name"":"图片22"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x190/f60/fff","width":240,"height":190,"name":"图片23"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x230/B5E61D/fff","width":240,"height":230,"name":"图片24"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x280/B5E61D/fff","width":240,"height":280,"name: „图片25“},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x210/eee/fff", "width":240, "height":210, "name"":"图片26"},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x180/000/fff", "width":240, "height":180, "name"":"图片27"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x240/B5E61D/fff","width":240,"height":240,"name":"图片28"},
{"href":http:xxxxxxx, "src":
http://dummyimage.com/240x195/B5E61D/fff","width":240,"height":195,"name":"图片29"},
{"href": "http:xxxxxxx", "src": "
http://dummyimage.com/240x245/259/fff", "width":240, "height":245, "name": „图片30“}
]
}
var wallPic = function(){
var $target = $('#wallList'),
$li = $target.find('li'),
$tips = $('#loadTips'),
oTop = 0, //Scrollender Beurteilungswert
row = 3,//Anzahl der Spalten
.
url = 'xxxx', //Ajax-Anfrageadresse
On_off = TRUE; // Den Schalter der Struktur einfügen, um zu verhindern, dass AJAX die Daten mehrmals falsch lädt
zurück{
fillData:function(callback){
var _that = this;
on_off = false;
/* ajax
---------*/
// $.get(url,{ page:page,count:30},function(json){
//
//
//
// },'json');
/* Simulationstest-Timer einstellen, um Ajax-Anfragedaten zu simulieren
-------------*/
setTimeout(function(){
// Simulation beendet
If(page==3){
_that.loadedTips();
zurück;
_that.appendHTML(testJson.data);
on_off = true;
},400);
},
appendHTML:function(data){
var len = data.length,
n = 0;
for(;n
var k = 0;
n>(row-1)?k=n%row:k=n;
$li[k].innerHTML = '
' data[n].name '';
}
this.getOTop();
},
getOTop:function(){
oTop = Math.min.apply(null,[$li.eq(0).height(),$li.eq(1).height(),$li.eq(2).height()]) $target .offset().top;
},
geladenTips:function(){
$('#loadTips').find('span').text('数据已加载完');
setTimeout(function(){
$('#loadTips').css({'visibility':'hidden'});
},200);
// 解绑事件
$(window).unbind('scroll',$.proxy(this.scrollEvent,this));
},
scrollEvent:function(){
if($(document).scrollTop() $(window).height()>oTop&&on_off){
this.fillData();
}
},
init:function(){
this.fillData();
$(window).bind('scroll',$.proxy(this.scrollEvent,this));
}
}
}();
wallPic.init();