您的位置:首页 > Web前端 > JQuery

ECSHOP滚动或点击加载更多订单(瀑布流)JQuery.more.js

2016-05-12 15:01 585 查看
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;
}
}
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  瀑布流 ecshop