ECSHOP滚动或点击加载更多订单(瀑布流)JQuery.more.js
来源:互联网 发布:知行书院培训学校 编辑:程序博客网 时间:2024/06/05 23:43
1,引用jquery.more.js
文件
在user_transaction.dwt
文件引入
<script type="text/javascript" src="themesmobile/68ecshopcom_mobile/js/jquery.js"></script><script type="text/javascript" src="themesmobile/68ecshopcom_mobile/js/jquery.more.js"></script>
2.添加html,js
代码
<div id="more"> <div class="single_item order_list info"> </div> <a href="javascript:;" class="get_more" style="text-align:center;"><img src='themesmobile/68ecshopcom_mobile/images/category/loader.gif' width="12" height="12"></a></div><script type="text/javascript">//瀑布流var url = 'user_orders.php?act=ajax';$(function() { $('#more').more({'address': url})});</script>
3.添加php
代码
$user_id = $_SESSION['user_id'];$last = $_POST['last']+1;$amount = $_POST['amount'];//异步调用if (!empty($_REQUEST['act']) && $_REQUEST['act'] == 'ajax'){ include('includes/cls_json.php'); $limit = " limit $last,$amount";//每次加载的个数 $json = new JSON;//重点$orders = get_user_orders_1($user_id, $amount, $last, ''); //$goodslist = get_index_best( $limit );foreach($orders as $val){ $GLOBALS['smarty']->assign('item',$val); $res[]['info'] = $GLOBALS['smarty']->fetch('library/user_orders_2.lbi');}}die($json->encode($res));
其中,$order是你要追加进去的部分的分配数据,此处调用自定义函数获取数据
4.追加部分的html代码
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <h2> <a href="supplier.php?suppId={$item.supplier_id}"> <img src="themesmobile/68ecshopcom_mobile/images/dianpu.png"> <span>订单日期:{$item.order_time}</span> </a> </h2> <a href="user.php?act=order_detail&order_id={$item.order_id}"> {foreach from=$item.goods_list item=goods name=goods} <dl> <dt> <img src="./../{$goods.goods_thumb}"> </dt> <dd class="name"> <strong>{$goods.goods_name|truncate:25}</strong> </dd> <dd class="pice"> <em id="num_{$goods.goods_id}">x{$goods.goods_number}</em> {$goods.formated_goods_price}<input type="hidden" name="agoods_id" id="{$goods.goods_id}" value="{$goods.goods_id}"/><input type="hidden" name="goods_num" value="{$goods.goods_number}"/> </dd> </dl> {/foreach} {if $item.have_paid eq $item.total_fee} <div class="pic">共{$item.count}件商品<span>已付:</span><strong>{$item.total_fee}</strong></div> {else} <div class="pic">共{$item.count}件商品<span>已付:</span><strong>¥{$item.have_paid}</strong></div> {/if}</a><script type="text/javascript"></script> <div class="anniu" style=" width:95%"> <!-- {if $item.shipping_status eq 2} --> <!-- {if $goods.comment_state} --> <!-- {else} --> <a href="user.php?act=comment_order&rec_id={$goods.rec_id}" class="on_comment">评价</a> <!-- {/if} --> <!-- {if $goods.shaidan_state} --> <!-- {else} --> <a href="user.php?act=shaidan_send&id={$goods.rec_id}" class="on_comment">晒单</a> <!-- {/if} --> <!-- {/if} --> <!-- {if $item.pay_status eq 2 && $item.have_paid neq $item.total_fee} --> {$item.handler}(已付定金) <!-- {else} --> {$item.handler} <!-- {/if} --> </div>
补充:若不能直接滚动加载需要手动点击才能加载则可能是jquery.more.js
文件,将第二个判断改为原生js即可
$(window).scroll(function() { if (is_stop) { //console.dir(window.innerHeight); if ($(window).scrollTop() == $(document).height() - window.innerHeight && is_stop == true) { is_stop == false; $('.get_more').click(); is_stop == true; } } });
0 0
- ECSHOP滚动或点击加载更多订单(瀑布流)JQuery.more.js
- js瀑布流滚动加载
- 使用jquery.more.js来实现点击底部更多后, 底部加载出新的数据
- jQuery瀑布流加载更多数据
- [jquery 经过检验成功]使用jquery.more.js来实现点击底部更多后, 底部加载出新的数据
- jquery 滚动,或点击,加载文章
- js瀑布流滚动无限加载(路径需要修改)
- Js(JQuery)实现滚动到底部加载更多(翻页)
- 瀑布流的加载更多
- jquery 实现点击加载更多
- jquery列表点击加载更多
- web前端,jquery实现瀑布流(鼠标滚动不断加载)
- 织梦dedecms首页列表页ajax点击下拉加载更多文章瀑布流效果
- 瀑布流 上拉加载更多
- vue瀑布流组件滑动加载更多
- JQuery滚动加载更多数据实例
- jquery weui ajax滚动加载更多
- jquery制作图片瀑布流点击按钮加载更多内容
- JavaScript代码-创建交互网页
- csdn如何转载别人的文章
- Quartz2d 的Path路径
- RxJava中ActionX与FuncX的区别
- MessageDigest详解(Java自带加密)
- ECSHOP滚动或点击加载更多订单(瀑布流)JQuery.more.js
- java序列化
- Matlab 最小外接矩形
- 升级正版win10遇到的琐碎事(MBR分区表GPT分区表)
- 二叉树(补充)
- 57-001-1 bootstrap实现图片轮播效果
- Weblogic/Tomcat服务器(过滤)禁止访问指定后缀名文件
- Coding如何上传项目
- Quartz2d 使用UIkit绘图方法 CADisplayLink 定时器