js 手机页面向上以及向下滚屏

前言：

开发手机页面缺少不了就是滚动分页，如果判断距离大小去触发 onscroll事件呢？

下面用到3个js 函数 scrollTop clientHeight scrollHeight

 

准备：

先利用这3个函数写成自定义函数

 

/********************    
* 取窗口滚动条高度     
******************/     
function getScrollTop()      
{      
    var scrollTop=0;      
    if(document.documentElement&&document.documentElement.scrollTop)      
    {      
        scrollTop=document.documentElement.scrollTop;      
    }      
    else if(document.body)      
    {      
        scrollTop=document.body.scrollTop;      
    }      
    return scrollTop;      
}      
     
     
/********************    
* 取窗口可视范围的高度     
*******************/     
function getClientHeight()      
{      
    var clientHeight=0;      
    if(document.body.clientHeight&&document.documentElement.clientHeight)      
    {      
        var clientHeight = (document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;              
    }      
    else     
    {      
        var clientHeight = (document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;          
    }      
    return clientHeight;      
}      
/********************    
* 取文档内容实际高度     
*******************/     
function getScrollHeight()      
{      
    return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight);      
}  

 

最后：

 

//向上或向上滚动获取数据
function getScrollData()
{      
    var pagey=0;
    if(window.pageYOffset)
        pagey=window.pageYOffset;
    var sh=getScrollHeight();

    //if(1==1)
    if(!isdlg && !isloadData && ((currentpage<pagecount && (pagey+getScrollTop()+getClientHeight())>=sh)||(currentpage>1 && getScrollTop()<=0 )))
    {
    
        //向下
        if (currentpage<pagecount && (pagey+getScrollTop()+getClientHeight())>=sh)
        {
            currentpage++;
        }
//向上
        else
        {
            currentpage--;
        }
        //自定义获取数据的ajax函数
        getData(currentpage,keyWord,subName)
    }

}