手机端微网站实现查看更多实例

 1，index.html之ajax

<div class="tab1" id="main">
    <include file="ajaxIndex" />
</div>

<script type="text/javascript">
    var p = 2;
    $(function () {
        $("body").delegate('.more','click',function(){
            var time = $(this).attr('data-time');
            var type = $(this).attr('data-type');
            $(this).remove();
            $(".ajaxMore").html('<img src="__PUBLIC__/wechat/images/loading.gif">');
            $.post('/wechat.php/order/ajaxIndex',{p:p},function(data)
            {
                if(data.error == 0)
                {
                    $(".ajaxMore").remove();
                    $(data.html).appendTo('#main');
                    p++;
                }
                else
                {
                    $.prompt(data.msg, {
                        buttons: { "确定": true }
                    });
                }
            },'json');
        });
    })
</script>

 

 2，ajaxIndex.html

<empty name="OrderList">
       no data
<else />
    <ul>
    	<volist name="OrderList" id="Order">
       	    <li>xxxxx</li>
    	</volist>
    </ul>

    <div class="ajaxMore">
        <a href="javascript:;" class="more">
            点击查看更多
        </a>
    </div>
</empty>

 

3，order.php

class Order
{
    public function list()
    {
        $data = $this->getListData($page);
        $this->assign('OrderList', $data);
    }    

    public function ajaxIndex()
    {
        $page = I('p',1);

        $data = $this->getListData($page);
        $this->assign('OrderList', $data);

        $content = $this->fetch('ajaxIndex');
        $json = array('error'=>0, 'html'=>$content);
        echo json_encode($json);
        exit;
    }

    public function getListData()
    {
        return $data;
    }
}