花魁直播高品质美女在线视频互动社区 - 花魁直播官方版

 歡迎來(lái)到素材無(wú)憂網(wǎng),按 + 收藏我們
登錄 注冊(cè) 退出 找回密碼

帝國(guó)CMS二次開發(fā)內(nèi)容點(diǎn)擊無(wú)限加載思路分享

時(shí)間: 2020-09-16 10:50 閱讀: 作者:素材無(wú)憂網(wǎng)

帝國(guó)CMS無(wú)限加載是借鑒別的CMS插件更改的?,F(xiàn)在還在制作樣式中,完成后會(huì)以插件分享給大家!

無(wú)限加載常見的原理是利用PHP文件調(diào)用數(shù)據(jù)庫(kù)信息,在用JS讀取PHP信息,最后插入顯示到頁(yè)面。

PHP文件代碼

<?php
require_once('../../e/class/connect.php'); //引入數(shù)據(jù)庫(kù)配置文件和公共函數(shù)文件
require('../../e/class/db_sql.php'); //引入數(shù)據(jù)庫(kù)操作文件
$link=db_connect(); //連接MYSQL
$empire=new mysqlquery(); //聲明數(shù)據(jù)庫(kù)操作類
$editor=1; //聲明目錄層次

$last = $_POST['last'];
$amount = $_POST['amount'];

$user = array('demo1','demo2','demo3','demo3','demo4');
$sql=$empire->query("select * from ceshi_ecms_news order by id desc limit $last,$amount");

while ($row=$empire->fetch($sql)) {
	$addurl="<a href=".$row['titleurl'].">".$row['title']."</a>";
	$sayList[] = array(
		'content'=>$row['username'],
		'author'=>$addurl,
		'url'=>$row['titleurl'],
		'date'=>date('m-d H:i',$row['newstime'])
      );
}
echo json_encode($sayList);

db_close(); //關(guān)閉MYSQL鏈接
$empire=null; //注消操作類變量
?>

JS調(diào)用代碼

(function( $ ){          
    var target = null;
    var template = null;
    var lock = false;
    var variables = {
        'last'      :    0        
    } 
    var settings = {
        'amount'      :   '10',          
        'address'     :   'comments.php',
        'format'      :   'json',
        'template'    :   '.single_item',
        'trigger'     :   '.get_more',
        'scroll'      :   'false',
        'offset'      :   '100',
        'spinner_code':   ''
    }
    
    var methods = {
        init  :   function(options){
            return this.each(function(){
              
                if(options){
                    $.extend(settings, options);
                }
                template = $(this).children(settings.template).wrap('<p/>').parent();
                template.css('display','none')
                $(this).append('<p class="more_loader_spinner">'+settings.spinner_code+'</p>')
                $(this).children(settings.template).remove()   
                target = $(this);
                if(settings.scroll == 'false'){                    
                    $(this).find(settings.trigger).bind('click.more',methods.get_data);
                    $(this).more('get_data');
                }                
                else{
                    if($(this).height() <= $(this).attr('scrollHeight')){
                        target.more('get_data',settings.amount*2);
                    }
                    $(this).bind('scroll.more',methods.check_scroll);
                }
            })
        },
        check_scroll : function(){
            if((target.scrollTop()+target.height()+parseInt(settings.offset)) >= target.attr('scrollHeight') && lock == false){
                target.more('get_data');
            }
        },
        debug :   function(){
            var debug_string = '';
            $.each(variables, function(k,v){
                debug_string += k+' : '+v+'n';
            })
            alert(debug_string);
        },     
        remove        : function(){            
            target.children(settings.trigger).unbind('.more');
            target.unbind('.more')
            target.children(settings.trigger).remove();
        },
        add_elements  : function(data){
            //alert('adding elements')
            
            var root = target       
         //   alert(root.attr('id'))
            var counter = 0;
            if(data){
                $(data).each(function(){
                    counter++
                    var t = template                    
                    $.each(this, function(key, value){                          
                        if(t.find('.'+key)) t.find('.'+key).html(value);
                    })         
                    //t.attr('id', 'more_element_'+ (variables.last++))
                    if(settings.scroll == 'true'){
                    //    root.append(t.html())
                    root.children('.more_loader_spinner').before(t.html())  
                    }else{
                    //    alert('...')
                          
                          root.children(settings.trigger).before(t.html())  

                    }

                    root.children(settings.template+':last').attr('id', 'more_element_'+ ((variables.last++)+1))  
                 
                })
                
                
            }            
            else  methods.remove()
            target.children('.more_loader_spinner').css('display','none');
            if(counter < settings.amount) methods.remove()            

        },
        get_data      : function(){   
           // alert('getting data')
            var ile;
            lock = true;
            target.children(".more_loader_spinner").css('display','block');
            $(settings.trigger).css('display','none');
            if(typeof(arguments[0]) == 'number') ile=arguments[0];
            else {
                ile = settings.amount;              
            }
            
            $.post(settings.address, {
                last : variables.last, 
                amount : ile                
            }, function(data){            
                $(settings.trigger).css('display','block')
                methods.add_elements(data)
                lock = false;
            }, settings.format)
            
        }
    };
    $.fn.more = function(method){
        if(methods[method]) 
            return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        else if(typeof method == 'object' || !method) 
            return methods.init.apply(this, arguments);
        else $.error('Method ' + method +' does not exist!');

    }    
})(jQuery)

HTML代碼

<script type="text/javascript" src="js/jquery.more.js"></script>    
<script>    
$(function(){    
$('#more').more({'address': 'data.php'})    
});    
</script>    
<p class="lb-menu">    
<p class="sideMenu">    
<h3 class="on"><em></em>衣服</h3>    
<ul>    
<li>男士</li>    
<li>女士</li>    
<li>童裝</li>    
</ul>    
<h3><em></em>鞋子</h3>    
<ul>    
<li>男士</li>    
<li>女士</li>    
<li>童裝</li>    
</ul>    
<h3><em></em>配飾</h3>    
<ul>    
<li>男士</li>    
<li>女士</li>    
<li>童裝</li>    
</ul>    
</p>    
</p>    
<p id="more">    
<p class="single_item">    
<p class="element_head">    
<p class="date"></p>    
<p class="author"></p>    
</p>    
<p class="content"></p>    
<p class="url"></p>    
</p>    
<a href="javascript:;" class="get_more">::點(diǎn)擊加載更多內(nèi)容::</a> </p>


版權(quán)聲明: 本站資源均來(lái)自互聯(lián)網(wǎng)或會(huì)員發(fā)布,如果侵犯了您的權(quán)益請(qǐng)與我們聯(lián)系,我們將在24小時(shí)內(nèi)刪除!謝謝!

轉(zhuǎn)載請(qǐng)注明: 帝國(guó)CMS二次開發(fā)內(nèi)容點(diǎn)擊無(wú)限加載思路分享

標(biāo)簽:  
相關(guān)文章
模板推薦