加载信息,先从数据库取出5条实现分页,鼠标向上滑动触发Ajax再加载5条,达到异步刷新,优化加载。。。
php数据库取数据
<?php
include("conn1.php");
include('../function/functions.php');
$page=intval($_GET['page']);
$page=$page==?:$page;
$page_size=;
$limit = (($page - ) * $page_size) . "," . $page_size;
$sql="select *from v9_news where catid=182 and status=99 order by inputtime desc limit $limit"; $result=mysqli_query($link,$sql);
$arr=array();
$item=array();
while($row=mysqli_fetch_assoc($result)){
$row['inputtime']= date('m-d',$row['inputtime']);
$row['updatetime']= date('m-d',$row['updatetime']);
$arr[]=$row;
}
$item['page']=$page;
$item['item']=$arr;
$json=json_encode($item,JSON_UNESCAPED_UNICODE);
echo $json;
jquery及ajax实现滑动请求加载
function onload1(url,a){
$.ajax({
type: "get",
url: url,
dataType: "json",
data: {
page:0,
},
success: function(data) {
$(a).html(makehtml0(data)); },
error: function(i) {
alert("网络错误");
}
});
}
function scroll1(url){
var page=2;
var old=0;
var a=true; //开关定时器的作用
//向下滑动
$("#item1mobile").scroll(function() {
var $this = $(this),
viewH = $(this).height(), //可见高度312
contentH = $(this).get(0).scrollHeight, //内容高度422
scrollTop = $(this).scrollTop(); //滚动高度
if(scrollTop > old) {
if(scrollTop / (contentH - viewH) >= 0.80) { //到达底部80%时,加载新内容
if(a){
$.ajax({
type: "get",
url: url,
dataType: "json",
data: {
page:page,
},
success: function(data) {
$('#item1mobile').append(makehtml0(data));
page=data.page+1;
a=true; },
error: function(i) {
alert("网络错误");
a=true;
}
});
}
a=false;
}
}
//上滑
old = scrollTop
}); }
var makehtml0 = function (data) {
var html = '';
for (var i = 0; i < data.item.length; i++) { html+="<div class='row'>"+"<a href='detail/legaldetail.php?id=" + data.item[i].id
+ "'>"+" <div class='col-xs-12 content'>"+"<div class='col-xs-12 title'>"
+data.item[i].title+"</div>"+" <div class='col-xs-4 date'>"
+data.item[i].inputtime+"</div>"+"</div>"+"</a>"+
"</div>"+"<div class='fenge111'>"+"</div>"; }
return html;
};
html页面
<div id="item1mobile" class="mui-slider-item mui-control-content mui-active"> </div> <script src="./js/jquery.js"></script>
<script type="text/javascript">
onload1('http://www.zbgh.org.cn/appUnion/data/legal-data-1.php','#item1mobile');
scroll1('http://www.zbgh.org.cn/appUnion/data/legal-data-1.php');
</script>
加载信息,先从数据库取出5条实现分页,鼠标向上滑动触发Ajax再加载5条,达到异步刷新,优化加载。。。的更多相关文章
- Tomcat 用 startup.bat 启动时,加载信息之后又关闭服务器(差不多一闪而过)问题
Tomcat 用 startup.bat 启动时,加载信息之后又关闭服务器(差不多一闪而过)问题 以前是正常的,后来在 server.xml 文件的 <Host> </Host> ...
- python之scrapy爬取jingdong招聘信息到mysql数据库
1.创建工程 scrapy startproject jd 2.创建项目 scrapy genspider jingdong 3.安装pymysql pip install pymysql 4.set ...
- PHP获取IP及地区信息(纯真IP数据库)
昨天在写程序的时候,发现在用户的时候记录IP和地区信息也许以后用得上,去网上找了找,发现实现的方式有好多好多,因为我用的ThinkPHP,后来又去TP官网找了找,最后采用了下面这种方法. <?p ...
- 优化加载jQuery的方法
请看下面的一段代码: <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js" ...
- SSH_框架整合4--添加员工信息
SSH_框架整合4--添加员工信息 一. 1 index.jsp:添加:<a href="emp-input">添加员工向信息:Add Employees' Infor ...
- iScroll.js 向上滑动异步加载数据回弹问题
iScroll是一款用于移动设备web开发的一款插件.像缩放.下拉刷新.滑动切换等移动应用上常见的一些效果都可以轻松实现. 现在最新版本是5.X,官网这里:http://iscrolljs.com/ ...
- 从数据库取出两个同样的字符串用equals比较返回false
1. 从网上搜索原因,大概总结为三点 1.1 取数据的两个数据库编码不一样,需要统一编码 1.2 字符类型不一样,可能一个为nchar一个为varchar 1.3 从数据库取出的数据有空格,需要tri ...
- 再谈 tp的 实例化 类 的自动加载
表示一个域名下的所有/任何主机 使用 的格式是: [*.] example.com 其中 , example.com叫着 裸域名. (这个example.com/net/org不能被注册, 被保留) ...
- FMX StringGrid向上滑动自动加载记录(二)
写完FMX StringGrid向上滑动自动加载记录(一)自己也觉得不理想,实现的别扭与复杂,现在找到更好的实现方法,原来,StringGrid从基类TCustomPresentedScrollBox ...
随机推荐
- android开发------Activity生命周期
这几天工作比较忙,基本没有什么时间更新播客了. 趁着今晚有点时间,我们来简单说一下什么是Activity生命周期和它们各阶段的特征 什么是生命周期 在还没有接触android开发的时候,听到有人说Ac ...
- Linux System and Performance Monitoring
写在前面:本文是对OSCon09的<Linux System and Performance Monitoring>一文的学习笔记,主要内容是总结了其中的要点,以及加上了笔者自己的一些理解 ...
- FTP 的搭建过程和遇到的问题
http://linux.it.net.cn/e/server/ftp/2015/0227/13554.htmlhttps://mp.weixin.qq.com/s?__biz=MzA3OTgyMDc ...
- Ubuntu里的若干问题解决方案
1. Ubuntu里出现两个屏幕,并且其中一个是“未知显示器”,无法去除时,可以尝试使用该命令:sudo apt-get install bumblebee-nvidia 2.虚拟机上Ubuntu开机 ...
- Java设计模式(七) 模板模式-使用钩子
1,模板类 package com.pattern.template; public abstract class CaffeineBeverageWithHook { void prepareRec ...
- 【BZOJ 1468】Tree 点分治
点分治$O(nlogn)$ 坚持到月考结束后新校就剩下我一个OIer,其他人早已停课了,老师估计懒得为我一个人开机房门,让我跟班主任说了一声,今晚就回到了老校,开始了自己都没有想到会来的这么早的停课生 ...
- Entity Framework Code First (八)迁移 Migrations
创建初始模型和数据库 在开始使用迁移(Migrations)之前,我们需要一个 Project 和一个 Code First Model, 对于本文将使用典型的 Blog 和 Post 模型 创建一个 ...
- jsrender-for循环中访问父属性
jsrender中使用for循环数据时有时需要访问父级数据. 而jsrender在循环中的父级数据存放在隐藏属性parent.parent.data中,使用案例如下 {{:#parent.parent ...
- 【HDU 4311】Meeting point-1(前缀和求曼哈顿距离和)
题目链接 正经解法: 给定n个点的坐标,找一个点,到其他点的曼哈顿距离之和最小.n可以是100000.大概要一个O(nlogn)的算法.算曼哈顿距离可以把x和y分开计算排好序后计算前缀和就可以在O(1 ...
- bzoj 1257
商最多有sqrt(n)个. #include<iostream> #include<cstdio> #include<cstring> #include<al ...