php – Codeigniter scrollpagination

我在codeigniter中使用 jquery插件scrollpagination我遇到问题,我的循环没有终止,也没有给出准确的结果.

这是我的HTML代码

<div id="main">
    <div id='friend_display'>
    <?php if($list->num_rows() > 0  ){
            foreach($list->result() as $show)
            {   ?>

    <div class="image-box" style="margin-left:30px" id='image-holder' >

        <div class="photo-cover">
            <a href="<?=base_url()?>uploads/user_images/<?php echo $show->user_image;?>" class="big-image"><img width="160px" height="117px" src="<?=base_url()?>uploads/user_images/friends/<?php echo $show->user_image;?>" alt="" /></a>
        </div>

        <p class="photo-name"><b><?php echo $show->user_name;?></b></p>


    </div>
    <?php } } else { echo '<div align="center" style="color:#FF0000; font-size:17px; font-weight:bold">You have no Friends yet</div>';}?>

    <div class="cl">&nbsp;</div>
</div></div>

这是脚本

<script type="text/javascript">
  var page_num = 1; 
   $(function(){
$('#friend_display').scrollPagination({
    'contentPage': '<?=base_url()?>friends/load_more',// the url you are fetching the results
    'contentData': {page_num:$('.image-box').size()},// these are the variables you can pass to the request,for example: children().size() to know which page you are
    'scrollTarget': $(window),// who gonna scroll? in this example,the full window
    'heightOffset': 10,// it gonna request when scroll is 10 pixels before the page ends
    'beforeLoad': function(){ // before load function,you can display a preloader div
        $('#loading1').fadeIn();    
    },'afterLoad': function(elementsLoaded){ // after loading content,you can use this function to animate your new elements
         $('#loading1').fadeOut();
         var i = 0;
         $(elementsLoaded).fadeInWithDelay();
         page_num:$('.image-box').size();
    }
});

// code for fade in element by element
$.fn.fadeInWithDelay = function(){
    var delay = 0;
    return this.each(function(){
        $(this).delay(delay).animate({opacity:1},200);
        delay += 100;
    });
};

 });
</script>

这是我的PHP功能

function load_more() 
{
    $offset =   $this->input->post('page_num');
    $list       =   $this->friends_model->show_friends($offset);
    if($list->num_rows()>0)
    {
        foreach($list->result() as $show)
        {?>

            <div class="image-box" style="margin-left:30px" id='image-holder'>
            <div class="photo-cover">
            <a href="<?=base_url()?>uploads/user_images/<?php echo $show->user_image;?>" class="big-image"><img width="160px" height="117px" src="<?=base_url()?>uploads/user_images/friends/<?php echo $show->user_image;?>" alt="" /></a>
            </div>

        <p class="photo-name"><b><?php echo $show->user_name;?></b></p>

    </div>
    <?php } ?>
    <div class="cl">&nbsp;</div>
    <?php
    } 
    else 
    {  
        //echo(333); 
    }
}

在db i jst中显示主要查询
$这 – > DB->极限(12,$偏移);
谁能告诉我我错过了什么？

打开此链接到wathch完整代码.Scroll Pagination

'contentData': {page_num:$('.image-box').size()},

并添加此行

'childClass' : '.image-box',

打开scrollpagination.js文件后,将此行数据：opts.contentData替换为此数据：{page_num：$(obj).children(opts.childClass).size()},.再次替换’contentData’：{},这行包含’childClass’：’.datalist’,.

在你的函数display_friends()中,请替换exit;函数与此行echo’< input type =“hidden”id =“nodata”value =“1”/>‘; .之后写你的脚本看起来像这样：

$(function(){

    $('#nomoreresult').hide();
    $('#loading1').hide();
    $('#friend_display').scrollPagination({

    'contentPage': 'Your_Url',// the url you are fetching the results
     // these are the variables you can pass to the request,for example: children().size() to know which page you are
    'childClass' : '.image-box','scrollTarget': $(window),you can display a preloader div
        $('#loading1').show().fadeIn();
    },'afterLoad': function(elementsLoaded){
     // after loading content,you can use this function to animate your new elements
        $('#loading1').hide().fadeOut();
        $(elementsLoaded).fadeInWithDelay();

        if($('#nodata').val() == '1'){
            $('#friend_display').stopScrollPagination();
            $('#loading1').hide();
            $('#nomoreresult').show().fadeIn();

        }

    }
});

// code for fade in element by element
$.fn.fadeInWithDelay = function(){
    var delay = 0;
    return this.each(function(){
        $(this).delay(delay).animate({opacity:1},200);
        delay += 1000;
    });
};

（编辑：安卓应用网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!