html ajax请求 php 下拉 加载更多数据 (也可点击按钮加载更多)
<input type="hidden" class="total_num" id="total" value="{$total}">
<div class="diy-richtext messagebox" style="padding-top:10px;">
{loop $messagelist $k $v}
<div class="message" rel='{$k}'>
<p class="message_icon"><img width="21" alt="" height="20" style="width: 20px; height: 20px;" src="../addons/ewei_shopv2/static/img/icon{$v['cateid']}.png" data-lazyloaded="true"></p>
<p class="message_cate" > {$v['cate_name']}</p>
<p class="message_title" >{$v['title']}
<span class="message_time" >{php echo date('Y-m-d H:i:s',$v['createtime']);}</span><br>
<p >{$v['detail']}<br>
</p><p><br>
</p>
</div>
{/loop}
</div>
<div class="fui-picturew row-4" onclick="getmore()" >加载更多..</div>
$(function() {
$(window).scroll(function(){
var scrollTop = $(this).scrollTop(); //滚动条距离顶部的高度
var scrollHeight = $(document).height(); //当前页面的总高度
var clientHeight = $(this).height(); //当前可视的页面高度
if(scrollTop + clientHeight >= scrollHeight){ //距离顶部+当前高度 >=文档总高度 即代表滑动到底部 count++; //每次滑动count加1
// filterData(serviceTypeId,industryId,cityId,count); //调用筛选方法,count为当前分页数
getmore();
}
});
});
function getmore(){
var total = $('#total').val()
FoxUI.loader.show('mini');
var data = {'classid': "{$classitem['id']}", 'merchid': "{$item['id']}", 'k': total};
$.ajax({
url: "{php echo mobileUrl('shop/category/getmoreMessage')}",
data: data,
cache: false
}).done(function (result) {
var data = jQuery.parseJSON(result);
FoxUI.loader.hide();
if (data.status == 1) {
if(data.result.code == 1){
$('.messagebox').append(data.result.html);
$('#total').val(data.result.total);
}else if(data.result.code == 2){
FoxUI.toast.show ('暂无更多')
}
} else {
alert("微信接口繁忙,请稍后再试!");
}
});
}
public function main()//显示页面
{
global $_W; $total = 6;//默认加载条数
$limit = " limit 0,$total";
$messagelist = pdo_fetchall('SELECT * FROM ' . tablename('ewei_shop_merch_message').'where displayorder = :displayorder order by id desc'.$limit, array(':displayorder'=>0)); // var_dump($messagelist);exit;
include $this->template();
}
public function getmoreMessage()//ajax下拉页面
{
global $_W;
global $_GPC; $rel = isset($_GPC['k'])?$_GPC['k']:0;
$where = "1" ;
$offset = $rel;
$offnum = 4;
$where .= " order by id desc" ;
$where .= " limit $offset,$offnum" ;
$total = $offset + $offnum;
$list = pdo_fetchall('SELECT * FROM ' . tablename('ewei_shop_merch_message') . ' WHERE '.$where);
$html = '';
foreach ($list as $k => $v) {
$cateid = $v['cateid'];
$html.='<div class="message" rel="'.$k.'">
<p class="message_icon"><img width="21" alt="" height="20" style="width: 20px; height: 20px;" src="../addons/ewei_shopv2/static/img/icon'.$cateid.'.png" data-lazyloaded="true"></p>
<p class="message_cate" > '.$v['cate_name'].'</p>
<p class="message_title" >'.$v['title'].'
<span class="message_time" >'.date('Y-m-d H:i:s',$v['createtime']).'</span><br>
<p >'.$v['detail'].'<br>
</p><p><br>
</p>
</div>';
} if($list){
$arr = array('code' => 1, 'msg' => '','html'=>$html,'total'=>$total);
show_json(1, $arr);
}else{
$arr = array('code' => 2, 'msg' => '暂无更多.',);
show_json(1, $arr);
}
}
public function getmoreMessage()//ajax下拉页面
{
global $_W;
global $_GPC;
$rel = isset($_GPC['k'])?$_GPC['k']:0;
$where = "1" ;
$offset = $rel;
$offnum = 4;
$where .= " order by id desc" ;
$where .= " limit $offset,$offnum" ;
$total = $offset + $offnum;
$list = pdo_fetchall('SELECT * FROM ' . tablename('ewei_shop_merch_message') . ' WHERE '.$where);
$html = '';
foreach ($list as $k => $v) {
$cateid = $v['cateid'];
$html.='<div class="message" rel="'.$k.'">
<p class="message_icon"><img width="21" alt="" height="20" style="width: 20px; height: 20px;" src="../addons/ewei_shopv2/static/img/icon'.$cateid.'.png" data-lazyloaded="true"></p>
<p class="message_cate" > '.$v['cate_name'].'</p>
<p class="message_title" >'.$v['title'].'
<span class="message_time" >'.date('Y-m-d H:i:s',$v['createtime']).'</span><br>
<p >'.$v['detail'].'<br>
</p><p><br>
</p>
</div>';
}
if($list){
$arr = array('code' => 1, 'msg' => '','html'=>$html,'total'=>$total);
show_json(1, $arr);
}else{
$arr = array('code' => 2, 'msg' => '暂无更多.',);
show_json(1, $arr);
}
}
html ajax请求 php 下拉 加载更多数据 (也可点击按钮加载更多)的更多相关文章
- ajax 多级联动 下拉框 Demo
写了ajax实现级联下拉框,考虑常用,并且级联个数随不同业务个数不同,于是就整理了一下,实现了 ajax + N级联动 下拉框的效果 效果图 HTML 代码 <h2> 省级联动</h ...
- 用Ajax遍历三级下拉框
用Ajax遍历三级下拉框 //通过一级分类的id查二级分类(记得在前端网页按钮绑定点击事件) function getSecondCategory(oneCategoryId){ alert(&quo ...
- ajax实时获取下拉数据
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> ajax ...
- ajax请求为异步操作时,返回的数据不会被并列函数执行
ajax请求为异步操作时,返回的数据不会被并列函数执行
- phpStudy4——前端页面使用Ajax请求并解析php返回的json数据
项目需求: 在html页面显示所有用户列表信息. 需求分析: 1. html页面使用ajax向后端php请求用户数据 2. php脚本查询数据库,并将查询后的结果以json格式返回前端html页面 3 ...
- //点击按钮加减音频音量到最小会出现bug什么意思???
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Ajax做列表无限加载和Ajax做二级下拉选项
//栏目Ajax做加载 public function ajaxlist(){ //echo "http://www.域名.com/index.php?a=Index&c=Index ...
- ajax三级联动下拉菜单
ajax写三级联动,先写一个文件类吧,以后用的时候直接调用即可: 来找一张表: 实现: 中国地域的三级联动:省.市.区: 图: 说一下思路: (1)当用户选择省份的时候触发事件,把当前的省份的id通过 ...
- Ext之页面多次请求问题(下拉框发送无关请求)
extjs 下拉框在拉取本地数据,然后又要展示后台数据时,出现过此问题(加载页面,自动发送无关的请求导致后台出现错误日志) { xtype:'combo', id:'state', width:130 ...
随机推荐
- Echarts学习笔记
1.Ecahrts使用首先需要引用js文件 Echarts.js 然后定义一个带id的容器(div就可以) 然后就可以初始化echarts了 ↓这是柱形图 <h2 class="con ...
- Vue.js - Day1
什么是Vue.js Vue.js 是目前最火的一个前端框架,React是最流行的一个前端框架(React除了开发网站,还可以开发手机App, Vue语法也是可以用于进行手机App开发的,需要借助于We ...
- jQueryMobile(一)
一].jQuery Mobile 页面 <!DOCTYPE html> <html lang="zh-cn"> <head> <meta ...
- Android GreenDao清空数据库的方法
最近在做项目的时候,为了方便测试人员测试,在应用中加入正式库和测试库切换的功能.为了防止正式库和测试库切换带来的数据冲突,切换的时候必须把当前的数据库清空.代码如下: package com.exam ...
- Annotation版本的HelloWorld
hiberante 的 annotation历史: 在hibernate3以后,开始支持Annotation; 先有hiberante再有JPA,有了JPA标准之后,hibernate写了Annota ...
- May 2 2017 Week 18 Tuesday
The beauty of the journey is found in the scenery along the way. 旅行之美在于沿途所见的风景. Several years ago, I ...
- Selenium入门8 js调用
execute_script 可以执行js和jquery脚本 示例如下:修改百度首页的按钮字体颜色,按钮隐藏,按钮显示 #coding=utf-8 # 调用js jquery from seleniu ...
- C#后台unxi时间戳转换为前台JS时间的方法
后台返回的时间是一个格式为 /Date(1530153274362)/ 的unxi时间戳前台转换代码:var matchResult = data.match(/(\d+)/);if (matchRe ...
- framework7 可以拉动右侧工具栏和点击当前item就可以出发事件的HTML结构
<li class="swipeout"> <div class="swipeout-content item-content"> &l ...
- 【转】WebSocket 是什么原理?为什么可以实现持久连接?
WebSocket是HTML5出的东西 也就是说HTTP协议没有变化 但HTTP是不支持持久连接的(长连接,循环连接的不算)或者说WebSocket干脆就不是基于HTTP来执行的.但是...说不通啊. ...