参数说明：
'amount' : '10', //每次显示记录数 'address' : 'comments.php', //请求后台的地址 'format' : 'json', //数据传输格式 'template' : '.single_item', //html记录DIV的class属性 'trigger' : '.get_more', //触发加载更多记录的class属性 'scroll' : 'false', //是否支持滚动触发加载 'offset' : '100', //滚动触发加载时的偏移量
其中还有一个more_loader_spinner这个参数；
HTML
首先要引入jquery库和jquery.more.js插件，jquery.more.js已经将许多功能都封装好了，并提供了参数配置的功能。
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.more.js"></script>
模板内容：
<div id="more"> <div class="single_item"> <div class="element_head"> <div class="date"></div> <div class="author"></div> </div> <div class="content"></div> </div> <a href="javascript:;" class="get_more">::点击加载更多内容::</a> </div>
这个用法可以有：点击页面，先loading5秒在加载数据出来，另外一个点击加载更多
效果为：
PHP数据为：
/* * 异步显示商品列表 by wang */ if ($_GET['act'] == 'asynclist') { $sayList = array(); if (is_array($list)) { foreach ($list as $val) { $max_amount = $val['max_amount'] ? $val['max_amount'] : $_LANG['nolimit']; if ($val['act_range'] != $_LANG['far_all']) { $extends = ':<br />'; foreach ($val['act_range_ext'] as $key => $value) { @$extends .="<a href="" . $val['program'] . $value['id'] . "" taget='_blank' class='f6'><span class='f_user_info'><u>" . $value['name'] . "</u></span></a>"; } } $user_rank = ""; foreach ($val['user_rank'] as $rank) { @$user_rank .= $rank." "; } $act_type_ext = ( $val['act_type'] != $_LANG['fat_goods']) ? $val['act_type_ext'] : ''; $gift = ''; foreach ($val['gift'] as $key => $value) { $price = $value['price'] > 0 ? $value['price'] . $_LANG['unit_yuan'] : $_LANG['for_free']; @$gift .="<dl class='gift'><dt><a href='goods.php?id=".$value['id']."'><img src='".$config['site_url'].$value['thumb']."' /></a></dt><dd><a href='goods.php?id=".$value['id']."'>".$value['name']."</a></dd><dd>".$price."</dd></dl>"; } $sayList[] = array( 'pro-inner' => '<section class="order_box padd1 radius10"><table class="ectouch_table" width="100%" border="0" cellspacing="0" cellpadding="5"> <tr> <td width="25%" bgcolor="#ffffff" align="right">' . $_LANG['label_act_name'] . '</td> <td width="75%" colspan="3" bgcolor="#ffffff" align="left">' . $val['act_name'] . '</td> </tr> <tr> <td width="15%" bgcolor="#ffffff" align="right">' . $_LANG['label_start_time'] . '</td> <td width="35%" bgcolor="#ffffff" align="left">' . $val['start_time'] . '</td> <td width="15%" bgcolor="#ffffff" align="right">' . $_LANG['label_max_amount'] . ' </td> <td width="35%" bgcolor="#ffffff" align="left"> ' . $max_amount . ' </td> </tr> <tr> <td bgcolor="#ffffff" align="right">' . $_LANG['label_end_time'] . '</td> <td bgcolor="#ffffff" align="left">' . $val['end_time'] . '</td> <td bgcolor="#ffffff" align="right">' . $_LANG['label_min_amount'] . '</td> <td width="200" bgcolor="#ffffff" align="left">' . $val['min_amount'] . '</td> </tr> <tr> <td bgcolor="#ffffff" align="right">' . $_LANG['label_act_range'] . '</td> <td bgcolor="#ffffff" align="left"> '. $val['act_range'] .$extends.' </td> <td bgcolor="#ffffff" align="right">'.$_LANG['label_user_rank'].'</td> <td bgcolor="#ffffff" align="left">'.$user_rank.'</td> </tr> <tr> <td bgcolor="#ffffff" align="right">' . $_LANG['label_act_type'] . '</td> <td colspan="3" bgcolor="#ffffff" align="left"> ' . $val['act_type'] . ' </td> </tr> <tr> <td colspan="4" bgcolor="#ffffff" align="right"> '.$gift.' </td> </tr> </table></section>' ); } } echo json_encode($sayList); exit; } /* * 异步显示商品列表 by wang end */
HTML代码为：
<section class="wrap" id="J_ItemList"> <section class="order_box padd1 radius10 single_item"> <div class="pro-inner"></div> </section> <a href="javascript:;" class="get_more"></a> </section>
JS代码为：
<script type="text/javascript"> jQuery(function($){ $('#J_ItemList').more({'address': 'activity.php?act=asynclist', 'spinner_code':'<div style="text-align:center; margin:10px;"><img src="{$ectouch_themes}/images/loader.gif" /></div>'}) }); </script>
其中例子：http://hdao123.com/mobile/activity.php
json数据为：http://hdao123.com/mobile/activity.php?act=asynclist