Question

这是我的分页脚本的工作原理

1：页面加载 - ajax自动加载内容（完成）

2：onClick load_more btn（使用切换显示） - 加载并显示更多内容（已完成）

3：onClick load_more btn（使用toogle hide） - 隐藏第2组加载的内容（如何实现）

<div class="resultsblock">

    <div class="results"></div>

    <div class="clear:left;"></div>

   <button class="load_more" id="load_more_button"></button>
   <div class="animation_image" style="display:block;">Loading...</div>

</div>

<script>

jQuery(document).ready(function() {  
    var url = "http://www.abc.com";

    var track_click = 1; //track user click on "load more" button

    var total_pages = <?php echo $this->totalPages(); ?>;
    console.log(total_pages);
    // default load 
    jQuery('.results').load(url, {'p':track_click}, function() 
    {


    jQuery('.animation_image').hide();

    if(total_pages==1) {  jQuery(".load_more").hide();  } else { jQuery(".load_more").show();    }

    }
); 

    jQuery(".load_more").toggle(function(){

    jQuery(this).hide();                  
        jQuery('.animation_image').show(); 
            console.log(track_click);    
            // ajax load first load
            jQuery.post(url,{'p': track_click}, function(data) {            
                jQuery(".load_more").show();                 
                jQuery(".results").append(data);               
                jQuery('.animation_image').hide();                  
            });        

        // Now how to hide the elements loaded by ajax 

    },function(){console.log('hide previous load')});   --- step 3      
});

// this may not affect toggle. It just waiting for ajax to finish and perform more..

jQuery(document).ajaxComplete(function(){
if(jQuery('.prod').length != 0) {
    jQuery(".prod").hover(function(){
    jQuery(this).find(".prod_title").hide();
    jQuery(this).find(".prod_desc").fadeIn();
},function(){        
jQuery(this).find(".prod_desc").fadeOut(); 

jQuery(this).find(".prod_title_wrap").show();
jQuery(this).find(".prod_title").show();

    });
}

});



</script>

我不想隐藏在启动时在页面加载时显示的第一个内容。我怎样才能做到这一点请提出建议。谢谢

Answer 1

我认为，那可以做到：

...
jQuery(".load_more").show();                   
jQuery(".results").fadeOut(function() {
    jQuery(".results")
        .empty()
        .append(data)
        .fadeIn()
    ;
});
...

如何使用切换功能隐藏以前加载的ajax内容

1 个答案: