视图

<html>

<head>
<title>健康知识</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div>
<ul class="et-list p-list">
<?php foreach($result as $k => $res): ?>
<li><?php echo $result[$k]['hlh_url']; ?></li><br/>
<li><a href="http://xhdoctor.ci.com/index.php/xh_client_h5/healthinfoc?id=<?php echo $result[$k]['id']; ?>"><?php echo $result[$k]['title']; ?></a></li><br />
<?php endforeach; ?>
</ul>
</div>
<div id="loadingbox"><img id="loading" style="display:none;height:20px;" src="http://img.lanrentuku.com/img/allimg/1212/5-121204193R0.gif"/></div> 《加载动态图。。。。动态图是 div标签有一个gif格式的小图标》
<script>
$(function(){
function loadMeinv() {
var url = window.location.href;
$.get(url, {p: count, response: 'ajax'}, function (json) {
console.log(json);
$('#loading').fadeOut(3000);
setTimeout( function(){
if (json.length == 0) {
onOff = false;
return false;
} else {
count++;
}
$.each(json, function (keyList, ovalue) {
var html = '<li>'+ovalue.hlh_url+'</li><br/>'
+'<li><a href="http://xhdoctor.ci.com/index.php/xh_client_h5/healthinfoc?id='+ovalue.id+'">'+ovalue.title+'</li><br />';
$minUl = getMinUl();
$minUl.append(html);
});
},1000);
}, 'json');
}

var onOff = true;
var count = 2;
// loadMeinv();
$(window).on("scroll", function () {
$minUl = getMinUl();
if (($(window).scrollTop() >= $minUl.height() - $(window).height()) && onOff && $('#loading').css('display') == "none") {
$('#loading').show();

loadMeinv();
}
});
function getMinUl() {
var $arrUl = $(".p-list");
var $minUl = $arrUl.eq(0);
$arrUl.each(function (index, elem) {
if ($(elem).height() < $minUl.height()) {
$minUl = $(elem);
}
});
return $minUl;
}
});

</script>
</body>
</html>

服务器的代码示例

控制器

/**
* 健康知识
*/
public function healthinfo(){
$data = array();
$page = $this->input->get('p') ? $this->input->get('p'):1;
$response = $this->input->get('response');
$type = "0";
$this->load->model('Xh_client_h5_model');
$data['result'] = $this->Xh_client_h5_model->get_healthinfo($type,$page);
if($response == 'ajax'){
echo json_encode($data['result']);die();
}
$this->load->view('healthinfo',$data);
}

模型

/**
* 获取健康知识的信息
* @param string $type 健康知识 0
* @param string $page
* @return 健康信息的列表
*/
public function get_healthinfo($type,$page){
$healthinfo = array();
$limit = 7;
$offset = ($page - 1) * $limit;
$this->db->where('type',$type);
$this->db->limit($limit, $offset);
$query = $this->db->get('hlh_message');
$row = $query->result_array();
foreach($row as $k=>$v){
$healthinfo[$k]['id'] = $v['id'];
$healthinfo[$k]['title'] = $v['title'];
$healthinfo[$k]['hlh_url'] = $v['hlh_url'];
$healthinfo[$k]['jump_url'] = $v['jump_url'];
}
return $healthinfo;
}

php ajax 下拉加载数据的更多相关文章

  1. Ajax 下拉加载数据

    $(document).scroll(function() { var pageHeight = $(document).height()-$(window).height(); var bodySc ...

  2. iscroll5 上拉,下拉 加载数据

    我这里的思路是上拉时候只是加载第一页的内容,可根据实际情况修改其中的代码.请勿照搬.样式没怎么调,可以加载gif动画.1.没有数据时候,下拉可以加载数据.2.没有数据时候,点击也可以加载数据.3.其余 ...

  3. Jquery手机下拉刷新,下拉加载数据

    一.Jquery手机下拉刷新,下拉加载数据.附加有源码 <!DOCTYPE html> <html> <head> <title>手机</titl ...

  4. 关于MJRefresh的下拉加载数据bug

    当没有更多数据的时候显示NoMoreData 我的理解是先结束刷新再显示没有更多 今天之前一直没发现有问题 贴之前的代码 [self.collectionView reloadData]; [self ...

  5. web移动端下拉加载数据简单实现

    //下拉加载在移动端会经常使用,有些小伙伴不清楚一些原理下面就简答的介绍一下 //首先需要监听window的滚动事件,下拉其实就是在监听window滚动事件 var pageNum = 1;//分页第 ...

  6. 手机网站下拉加载数据js(简单版)

    加载内容的地方html <div class="bgcolor_f0 clearfix"> <div class="recharge"> ...

  7. iscroll5 版本下的 上拉,下拉 加载数据

    上拉时候只是加载第一页的内容,可根据实际情况修改其中的代码. <section id="downwraper" class="nodeBottom bot0 bgf ...

  8. juqery 下拉加载数据

    html  代码  一开始是需要显示的第一页 <div class="hot-product f15 fixed-Width clearfix" id="goods ...

  9. ajax 下拉加载更多效果

    1.生成HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. AnimatorController动画遮罩

    游戏中,我们的人物在某些时候,可能在一个时间点在做两件事,这样就需要同时播放两个动画,但我们肯定不能简单将其叠加,比如移动着开枪.攻击.挥手等等,那么在Unity中我们应该怎样实现这样的功能呢?且听我 ...

  2. vultr vps注册和后台教程

    我用了一年多vultr vps,感觉相当满意.我算是vultr最早的一批用户了,当时他们充值多少赠送多少,吸引大批新用户搬家到vultr,给linode和digitalocean vps不少的市场压力 ...

  3. CVE-2014-4115漏洞分析(2014.11)

    CVE-2014-4115漏洞分析 一.简介 该漏洞是由于Windows的Fastfat.sys组件在处理FAT32格式的硬盘分区存在问题.攻击者利用成功可导致权限提升. 影响的系统包括: Windo ...

  4. 用http-server 创建node.js 静态服务器

    今天做一本书上的例子,结果代码不能正常运行,查询了一下,是语法过时了,书其实是新买的,出版不久. 过时代码如下 var connect=require('connect'); connect.crea ...

  5. angular模拟elema网页1

    我们之前做的所有的网页项目都用的是假的json数据,真正的前后端的数据交互是个什么情况的呢?现在,我们就来看看. 首先,我们需要进行环境窃取,我们需要一个真实的数据,但是人家公司肯定不会将数据给你的, ...

  6. 一般css样式开头公共部分

    @charset "utf-8"; /* CSS Document -- skyren */ body { font-family: "微软雅黑", Arial ...

  7. ios随机数

    ios 随机数生成 字数612 阅读3037 评论1 喜欢15 最近一直使用随机数,为了以后方便查阅,总结一下: 在C中提供了rand().srand().random().arc4random()几 ...

  8. VirtualBox 不能为虚拟电脑打开一个新的任务 可能的解决方案

    1. 在虚拟机上右键,清除保存状态 2.Cannot load R0 module C:\Program Files\Oracle\VirtualBox/VBoxDD2R0.r0: SUPR3Load ...

  9. SMO 的环境

    Microsoft SQL Server System CLR Types - http://go.microsoft.com/fwlink/?LinkId=123721&clcid=0x40 ...

  10. APK重新签名方法

    Android使用SHA1-RSA算法进行签名.可通过eclipse插件进行,可以通过keytool和jarsigner 用命令行执行,也可以在源码下进行签名. 第一种:通过使用eclipse进行签名 ...