jq.ajax+php+mysql实现瀑布流缓冲加载数据 - 缥缈博客-个人技术博客

我要注册

jq.ajax+php+mysql实现瀑布流缓冲加载数据

作者： 缥缈     发布于「 技术教程 」 - 缥缈博客-个人技术博客

2019-6-3 分类： 技术教程 评论(0)
当前位置：首页 > 技术教程 > 正文
打赏

作者： 缥缈

个人技术博客

手机扫码查看

标签：

特别声明：文章多为网络转载，资源使用一般不提供任何帮助，特殊资源除外，如有侵权请联系！

效果图如下：




html+css代码

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>瀑布流展示数据</title>
<style type="text/css">
*{padding:0;margin:0;}
body{padding:0;margin:0;background:#ddd;}
img{border:none;}
a{text-decoration:none;color:#444;}
a:hover{color:#999;}
#title{width:600px;margin:20px auto;text-align:center;}
 
#wrap{width:auto;height:auto;margin:0 auto;position:relative;}
#wrap .box{width:280px;height:auto;padding:10px;border:none;float:left;}
#wrap .box .info{width:280px;height:auto;border-radius:8px;box-shadow:0 0 11px #666;background:#fff;}
#wrap .box .info .pic{width:260px;height:auto;margin:0 auto;padding-top:10px;}
#wrap .box .info .pic img{width:260px;border-radius:3px;}
#wrap .box .info .title{width:260px;height:30px;margin:0 auto;line-height:40px;text-align:center;color:#666;font-size:12px;font-weight:bold;overflow:hidden;display:block;white-space:nowrap;text-overflow:ellipsis}
#wrap .box .info .sale{width:250px;height:30px;line-height:30px;margin:10px auto 0;padding-bottom:10px;}
#wrap .box .info .sale label{display:inline-block;font-weight:bold;font-size:14px;margin-left:10px;}
#wrap .box .info .sale span{font-size:14px;color:#ff0036;}
#wrap .box .info .sale button{width:60px;height:25px;line-height:20px;font-size:12px;background:#ff0036;color:#fff;border-radius:5px;display:inline-block;float:right;margin-top:5px;outline:none;cursor:pointer;}
</style>
 
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="index.js"></script>
 
</head>
<body>
<center>
	<h2>瀑布流展示数据</h2>
</center>
 
	<div id="wrap">
	
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img02.taobaocdn.com/bao/uploaded/i2/T1UQTWXjlhXXa0TSA._083409.jpg_b.jpg"></div>
				<div class="title"><a href="#">新货 核桃 新疆大核桃 阿克苏薄皮核桃 仁很饱满【巴扎20度C】</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img03.taobaocdn.com/bao/uploaded/i3/T1XLbSXkFfXXaWt5AT_011948.jpg_b.jpg"></div>
				<div class="title"><a href="#">100%正宗 新疆库尔勒香梨 95元/箱15斤毛重 江浙沪包邮 新鲜 水果</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img04.taobaocdn.com/bao/uploaded/i4/T1BvJPXX4yXXad.nIW_024727.jpg_b.jpg"></div>
				<div class="title"><a href="#">新疆特产特级大个开心果250克 自然开口颗粒饱满 满2斤包邮</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img03.taobaocdn.com/bao/uploaded/i3/T1FUViXldEXXcf9moW_024549.jpg_b.jpg"></div>
				<div class="title"><a href="#">店庆一袋包邮晋谷香新疆和田壶瓶枣一级玉枣红枣批发山西大枣500g</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
	
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img03.taobaocdn.com/bao/uploaded/i3/T15hYMXmtXXXcklKTb_123629.jpg_b.jpg"></div>
				<div class="title"><a href="#">新疆野生肉苁蓉 大芸250克 沙漠人参</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img03.taobaocdn.com/bao/uploaded/i7/T1xoqfXaJsXXcUtHja_120240.jpg_b.jpg"></div>
				<div class="title"><a href="#">新疆特产 特级开口小银杏仁500g 杏核 野生饱满坚果干果 2斤包邮</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img01.taobaocdn.com/bao/uploaded/i1/T17x_ZXjFlXXaau978_071645.jpg_b.jpg"></div>
				<div class="title"><a href="#">美国大杏核 纸皮 香脆可口 粒粒饱满 休闲零食首选</a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img01.taobaocdn.com/bao/uploaded/i1/T1.gT2XjFhXXcJGKE._111803.jpg_b.jpg"></div>
				<div class="title"><a href="#">湖南特产湘莲子\12年寸三莲2件包邮\农家自种纯天然\特级白莲450g </a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img01.taobaocdn.com/bao/uploaded/i1/T1B0CzXllkXXa_ca7T_010708.jpg_b.jpg"></div>
				<div class="title"><a href="#">新疆风特产小吃特级果干冰梅冰凉梅子休闲食品孕妇零食满200包邮 </a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
		
		<div class="box">
			<div class="info">
				<div class="pic"><img src="http://img01.taobaocdn.com/bao/uploaded/i1/T12dzXXbVcXXbjanLb_095349.jpg_b.jpg"></div>
				<div class="title"><a href="#">湖南特产白鹤铁板鸡蛋煎饼早餐饼 500g称重 比Tipo面包干好吃N倍 </a></div>
				<div class="sale"><label>价格：</label><span>5/kg</span><label>库存：</label><span>9999</span><button>购买</button></div>
			</div>
		</div>
	
	</div>
 
</body>
</html>



js代码

window.onload = function(){
	//运行瀑布流主函数,默认加载
	PBL('wrap','box');	
 
	var page=1;
 
	window.onscroll = function(){
		
	 if( getCheck() ) {
 
		if(page>5){
				return false;
			}else{
				page++;
				getAjax(page);		
			
			}
		}
 
	}
			
}	
//获取数据库数据		
function getAjax(page){
	$.ajax({
		type: 'POST',
		data:{'page':page},
		url: 'fall.php',
		dataType:'json',
		success:function(data){
		console.log(data);
 
		var wrap = document.getElementById('wrap');
		for(i in data){
			//创建box
			var box = document.createElement('div');
			box.className = 'box';
			wrap.appendChild(box);
			//创建info
			var info = document.createElement('div');
			info.className = 'info';
			box.appendChild(info);
			//创建pic
			var pic = document.createElement('div');
			pic.className = 'pic';
			info.appendChild(pic);
			//创建img
			var img = document.createElement('img');
			img.src =data[i].pic;
			img.style.height = 'auto';
			pic.appendChild(img);
			//创建title
			var title = document.createElement('div');
			title.className = 'title';
			info.appendChild(title);
			//创建a标记
			var a = document.createElement('a');
			a.innerHTML = data[i].title;
			title.appendChild(a);
			//创建div
			var sale= document.createElement('div');
			sale.className='sale';
			info.appendChild(sale);
			//创建价格
			var label1= document.createElement('label');
			label1.innerHTML="价格：";
			sale.appendChild(label1);
			var span1= document.createElement('span');
			span1.innerHTML=data[i].price;
			sale.appendChild(span1);
			//创建库存
			var label2= document.createElement('label');
			label2.innerHTML="库存：";
			sale.appendChild(label2);
			var span2= document.createElement('span');
			span2.innerHTML=data[i].num;
			sale.appendChild(span2);
			//创建购买btn
			var btn= document.createElement('button');
			btn.innerHTML="购买";
			sale.appendChild(btn);
				
		}
		PBL('wrap','box');
		
		},
		error:function(){
			alert("数据加载出错")
 
		}
 
 
	});	
 
}
	
//瀑布流主函数
function PBL(wrap,box){
	//	获得外层以及每一个box
	var wrap = document.getElementById(wrap);
	var boxs  = getClass(wrap,box);
	//	获得屏幕可显示的列数
	var boxW = boxs[0].offsetWidth;
	var colsNum = Math.floor(document.documentElement.clientWidth/boxW);
	wrap.style.width = boxW*colsNum+'px';//为外层赋值宽度
	//	循环出所有的box并按照瀑布流排列
	var everyH = [];//定义一个数组存储每一列的高度
	for (var i = 0; i < boxs.length; i++) {
		if(i<colsNum){
			everyH[i] = boxs[i].offsetHeight;
		}else{
			var minH = Math.min.apply(null,everyH);//获得最小的列的高度
			var minIndex = getIndex(minH,everyH); //获得最小列的索引
			getStyle(boxs[i],minH,boxs[minIndex].offsetLeft,i);
			everyH[minIndex] += boxs[i].offsetHeight;//更新最小列的高度
		}
	}
 
}
 
//获取类元素,储存数组
 
function getClass(wrap,className){
	var obj = wrap.getElementsByTagName('*');
	var arr = [];
	for(var i=0;i<obj.length;i++){
		if(obj[i].className == className){
			arr.push(obj[i]);
		}
	}
	return arr;
}
 
// 获取最小列的索引
 
function getIndex(minH,everyH){
	for(index in everyH){
		if (everyH[index] == minH ) 
		return index;
	}
}
 
// 数据请求检验
 
function getCheck(){
	var scrollHeight = document.documentElement.scrollHeight //可视区的高度加上滚动的高度
	var clientHeight = document.documentElement.clientHeight //可视区的高度
	var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;  //滚动条在Y轴上的滚动距离
	return scrollHeight == clientHeight + scrollTop ? true:false;
}
 
// 设置加载样式
 
var getStartNum = 0;//设置请求加载的条数的位置
function getStyle(box,top,left,index){
    if (getStartNum>=index) return;
    $(box).css({
    	'position':'absolute',
        'top':top,
        "left":left,
        "opacity":"0"
    });
    $(box).stop().animate({
        "opacity":"1"
    },999);
    getStartNum = index;//更新请求数据的条数位置
}


php代码

<?php 
$conn=new Mysqli($servername, $username, $password,dbname) 
if(!$conn){  
    echo "数据库连接错误!";exit;  
}  
mysqli_query($conn,"set names utf8");
$page=$_POST['page']; //获取前台请求的记录
$size=10;//每次请求的数据条数 
$start=($page-1)*10;//从几条开始求数据
$count=$conn->query("select id from foods")->num_rows;//记录总条数
$totalPage=ceil($count/$size);//记录可以请求的总次数
$result=$conn->query("select * from foods limit $start,$size");
while($row=mysqli_fetch_array($result)){  
    $datas[] = array("id"=>$row['id'],"title"=>$row['title'],"pic"=>$row['pic'],"price"=>$row['price'],"num"=>$row['num'],"count"=>$count,"totalPage"=>$totalPage);
}
echo json_encode($datas);
mysqli_close($conn);
?>



mysql数据库表

-- 创建表
 
CREATE TABLE `foods` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `title` varchar(100) NOT NULL,
  `pic` varchar(255) NOT NULL,
  `price` varchar(32) NOT NULL,
  `num` varchar(32) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=61 DEFAULT CHARSET=utf8;
 
 
-- 导入表数据
 
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('60','新货 核桃 新疆大核桃 阿克苏薄皮核桃 仁很饱满【巴扎20度C】','http://img02.taobaocdn.com/bao/uploaded/i2/T1UQTWXjlhXXa0TSA._083409.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('59','100%正宗 新疆库尔勒香梨 95元/箱15斤毛重 江浙沪包邮 新鲜 水果','http://img03.taobaocdn.com/bao/uploaded/i3/T1XLbSXkFfXXaWt5AT_011948.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('58','新疆特产特级大个开心果250克 自然开口颗粒饱满 满2斤包邮','http://img04.taobaocdn.com/bao/uploaded/i4/T1BvJPXX4yXXad.nIW_024727.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('57','店庆一袋包邮晋谷香新疆和田壶瓶枣一级玉枣红枣批发山西大枣500g','http://img03.taobaocdn.com/bao/uploaded/i3/T1FUViXldEXXcf9moW_024549.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('56','新疆野生肉苁蓉 大芸250克 沙漠人参','http://img03.taobaocdn.com/bao/uploaded/i3/T15hYMXmtXXXcklKTb_123629.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('55','新疆特产 特级开口小银杏仁500g 杏核 野生饱满坚果干果 2斤包邮','http://img03.taobaocdn.com/bao/uploaded/i7/T1xoqfXaJsXXcUtHja_120240.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('54','美国大杏核 纸皮 香脆可口 粒粒饱满 休闲零食首选','http://img01.taobaocdn.com/bao/uploaded/i1/T17x_ZXjFlXXaau978_071645.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('53','湖南特产湘莲子\\12年寸三莲2件包邮\\农家自种纯天然\\特级白莲450g ','http://img01.taobaocdn.com/bao/uploaded/i1/T1.gT2XjFhXXcJGKE._111803.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('52','新疆风特产小吃特级果干冰梅冰凉梅子休闲食品孕妇零食满200包邮 ','http://img01.taobaocdn.com/bao/uploaded/i1/T1B0CzXllkXXa_ca7T_010708.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('51','湖南特产白鹤铁板鸡蛋煎饼早餐饼 500g称重 比Tipo面包干好吃N倍 ','http://img01.taobaocdn.com/bao/uploaded/i1/T12dzXXbVcXXbjanLb_095349.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('50','湖南常德特产 原价35现价32元两只免邮 散装泰味酱板鸭 刚出炉的 ','http://img02.taobaocdn.com/bao/uploaded/i2/T1k1OWXdhdXXcbY.cU_015918.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('49','湖南特产 盐津铺子 香酥牛肉味兰花豆 蚕豆500克 4斤包邮 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1RO91XkhaXXch7OE6_062222.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('48','椒丝牛肉（四川特产自贡麻辣兔头/兔腿；缠丝兔；冷吃兔冷吃牛肉) ','http://img02.taobaocdn.com/bao/uploaded/i2/T1..5GXoxxXXalsP.1_041722.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('47','四川私房菜，特产小吃。味味妈妈秘制香辣牛蹄筋，透亮Q滑 ','http://img01.taobaocdn.com/bao/uploaded/i1/T1tx5EXlRnXXXlgy.6_062259.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('46','沈师傅鸡蛋干100g营养美味 四川特产 沈师傅鸡蛋干100克 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1KX6tXnJsXXcQC8k._112940.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('45','川香居 糖醋排骨 掌柜推荐 四川特产小吃零食 120g 满50包邮 ','http://img04.taobaocdn.com/bao/uploaded/i4/T16hPbXgJlXXbAIj.__080146.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('44','黄金香原味迷你猪肉脯56g 厦门特产 蜜汁猪肉干 中华老字号 零食 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1N19zXnxWXXXHy7g9_104229.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('43','淘金币 秒杀福建特产卤味风味小吃鸡爪洪濑红毛凤爪零食小吃团购 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1yKYTXdtoXXaCzp3._111208.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('42','厦门特产 香贡贡糖果牛味肉丁 XO牛味肉粒4份包邮 舌尖上的中国 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1cx23XetaXXauXCg8_071539.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('41','买就送茶叶品尝包 八克装 福建1725安溪铁观音清香型 乌龙茶 特级','http://img01.taobaocdn.com/bao/uploaded/i1/T1__L0XndiXXaeglI._113301.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('40','包邮 云南特产鲜花饼 玫瑰花饼 现烤 礼盒 500克10个装 花味源 ','http://img01.taobaocdn.com/bao/uploaded/i1/T1a3TDXdprXXbz9bZ._111445.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('39','云南特产 滇味堂白酥皮云腿月饼50克 火腿月饼 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1.5rBXmpdXXaO_HYc_125908.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('38','【良品铺子】牛肝菌烧烤味即食 云南特产野生食用菌 休闲干货零食 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1Qn12Xa0qXXXMZ1I._112111.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('37','正宗 一手店 熟食 猪蹄 猪手 猪爪 猪脚 东北特产黑龙江美食小吃 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1Gm14XblaXXbp4MTX_115322.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('36','哈尔滨红肠正宗秋林里道斯红肠500克真空包装东北特产小吃不限重 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1ZTVvXjddXXcunnU7_065822.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('35','琦丽山珍 干果新货 奶油味夏威夷果 澳洲坚果 零食特产 特价促销 ','http://img02.taobaocdn.com/bao/uploaded/i2/T1kdzpXolvXXbjUT7U_015907.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('34','【山尖百合】贵州传统小吃波波糖 原生态养颜食材 无蔗糖添加剂','http://img03.taobaocdn.com/bao/uploaded/i3/T1Bz1cXdldXXbtTV.2_043100.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('33','特价抢购中【飘零大叔】杂志推荐-蜜汁猪肉脯- 靖江特产 零食 250','http://img01.taobaocdn.com/bao/uploaded/i1/T1v4urXfJvXXaGmNcU_015023.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('32','杭梦 特价坚果新疆巴旦木 纸皮巴旦木龙果 薄壳大杏仁 4件包邮','http://img03.taobaocdn.com/bao/uploaded/i3/T1.gm3XcXkXXbzFJAU_014249.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('31','包邮1000克(500克*2袋) 新疆天生无壳 生南瓜子仁','http://img03.taobaocdn.com/bao/uploaded/i3/T19iYSXa0gXXbATxfa_121311.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('30','包邮1000克(500克*2袋) 新疆天生无壳 生南瓜子仁','http://img03.taobaocdn.com/bao/uploaded/i3/T19iYSXa0gXXbATxfa_121311.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('29','杭梦 特价坚果新疆巴旦木 纸皮巴旦木龙果 薄壳大杏仁 4件包邮','http://img03.taobaocdn.com/bao/uploaded/i3/T1.gm3XcXkXXbzFJAU_014249.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('28','特价抢购中【飘零大叔】杂志推荐-蜜汁猪肉脯- 靖江特产 零食 250','http://img01.taobaocdn.com/bao/uploaded/i1/T1v4urXfJvXXaGmNcU_015023.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('27','【山尖百合】贵州传统小吃波波糖 原生态养颜食材 无蔗糖添加剂','http://img03.taobaocdn.com/bao/uploaded/i3/T1Bz1cXdldXXbtTV.2_043100.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('26','琦丽山珍 干果新货 奶油味夏威夷果 澳洲坚果 零食特产 特价促销 ','http://img02.taobaocdn.com/bao/uploaded/i2/T1kdzpXolvXXbjUT7U_015907.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('25','哈尔滨红肠正宗秋林里道斯红肠500克真空包装东北特产小吃不限重 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1ZTVvXjddXXcunnU7_065822.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('24','正宗 一手店 熟食 猪蹄 猪手 猪爪 猪脚 东北特产黑龙江美食小吃 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1Gm14XblaXXbp4MTX_115322.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('23','【良品铺子】牛肝菌烧烤味即食 云南特产野生食用菌 休闲干货零食 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1Qn12Xa0qXXXMZ1I._112111.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('22','云南特产 滇味堂白酥皮云腿月饼50克 火腿月饼 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1.5rBXmpdXXaO_HYc_125908.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('21','包邮 云南特产鲜花饼 玫瑰花饼 现烤 礼盒 500克10个装 花味源 ','http://img01.taobaocdn.com/bao/uploaded/i1/T1a3TDXdprXXbz9bZ._111445.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('20','买就送茶叶品尝包 八克装 福建1725安溪铁观音清香型 乌龙茶 特级','http://img01.taobaocdn.com/bao/uploaded/i1/T1__L0XndiXXaeglI._113301.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('19','厦门特产 香贡贡糖果牛味肉丁 XO牛味肉粒4份包邮 舌尖上的中国 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1cx23XetaXXauXCg8_071539.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('18','淘金币 秒杀福建特产卤味风味小吃鸡爪洪濑红毛凤爪零食小吃团购 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1yKYTXdtoXXaCzp3._111208.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('17','黄金香原味迷你猪肉脯56g 厦门特产 蜜汁猪肉干 中华老字号 零食 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1N19zXnxWXXXHy7g9_104229.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('16','川香居 糖醋排骨 掌柜推荐 四川特产小吃零食 120g 满50包邮 ','http://img04.taobaocdn.com/bao/uploaded/i4/T16hPbXgJlXXbAIj.__080146.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('15','沈师傅鸡蛋干100g营养美味 四川特产 沈师傅鸡蛋干100克 ','http://img04.taobaocdn.com/bao/uploaded/i4/T1KX6tXnJsXXcQC8k._112940.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('14','四川私房菜，特产小吃。味味妈妈秘制香辣牛蹄筋，透亮Q滑 ','http://img01.taobaocdn.com/bao/uploaded/i1/T1tx5EXlRnXXXlgy.6_062259.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('13','椒丝牛肉（四川特产自贡麻辣兔头/兔腿；缠丝兔；冷吃兔冷吃牛肉) ','http://img02.taobaocdn.com/bao/uploaded/i2/T1..5GXoxxXXalsP.1_041722.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('12','湖南特产 盐津铺子 香酥牛肉味兰花豆 蚕豆500克 4斤包邮 ','http://img03.taobaocdn.com/bao/uploaded/i3/T1RO91XkhaXXch7OE6_062222.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('11','湖南常德特产 原价35现价32元两只免邮 散装泰味酱板鸭 刚出炉的 ','http://img02.taobaocdn.com/bao/uploaded/i2/T1k1OWXdhdXXcbY.cU_015918.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('10','湖南特产白鹤铁板鸡蛋煎饼早餐饼 500g称重 比Tipo面包干好吃N倍 ','http://img01.taobaocdn.com/bao/uploaded/i1/T12dzXXbVcXXbjanLb_095349.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('9','新疆风特产小吃特级果干冰梅冰凉梅子休闲食品孕妇零食满200包邮 ','http://img01.taobaocdn.com/bao/uploaded/i1/T1B0CzXllkXXa_ca7T_010708.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('8','湖南特产湘莲子\\12年寸三莲2件包邮\\农家自种纯天然\\特级白莲450g ','http://img01.taobaocdn.com/bao/uploaded/i1/T1.gT2XjFhXXcJGKE._111803.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('7','美国大杏核 纸皮 香脆可口 粒粒饱满 休闲零食首选','http://img01.taobaocdn.com/bao/uploaded/i1/T17x_ZXjFlXXaau978_071645.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('6','新疆特产 特级开口小银杏仁500g 杏核 野生饱满坚果干果 2斤包邮','http://img03.taobaocdn.com/bao/uploaded/i7/T1xoqfXaJsXXcUtHja_120240.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('5','新疆野生肉苁蓉 大芸250克 沙漠人参','http://img03.taobaocdn.com/bao/uploaded/i3/T15hYMXmtXXXcklKTb_123629.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('4','店庆一袋包邮晋谷香新疆和田壶瓶枣一级玉枣红枣批发山西大枣500g','http://img03.taobaocdn.com/bao/uploaded/i3/T1FUViXldEXXcf9moW_024549.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('3','新疆特产特级大个开心果250克 自然开口颗粒饱满 满2斤包邮','http://img04.taobaocdn.com/bao/uploaded/i4/T1BvJPXX4yXXad.nIW_024727.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('2','100%正宗 新疆库尔勒香梨 95元/箱15斤毛重 江浙沪包邮 新鲜 水果','http://img03.taobaocdn.com/bao/uploaded/i3/T1XLbSXkFfXXaWt5AT_011948.jpg_b.jpg','5/kg','9999');
insert into `foods`(`id`,`title`,`pic`,`price`,`num`)
values('1','新货 核桃 新疆大核桃 阿克苏薄皮核桃 仁很饱满【巴扎20度C】','http://img02.taobaocdn.com/bao/uploaded/i2/T1UQTWXjlhXXa0TSA._083409.jpg_b.jpg','5/kg','9999');
本文最后更新于2019-6-3，已超过 1 年没有更新，如果文章内容或图片资源失效，请留言反馈，我们会及时处理，谢谢！
分享到：
未经允许不得转载：

作者: 缥缈， 转载或复制请以 超链接形式 并注明出处 缥缈博客-个人技术博客。
原文地址： 《jq.ajax+php+mysql实现瀑布流缓冲加载数据》 发布于2019-6-3

标签：

相关推荐

评论

个人资料

...

...

  • 文章 225
  • 评论 29
  • 标签 32
  • 微语 25
美女壁纸

美女壁纸

动漫壁纸

动漫壁纸

最新文章

热门文章

切换注册

登录

您也可以使用第三方帐号快捷登录

切换登录

注册

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏