隨著Web2.0的興起，動態(tài)網(wǎng)頁的需求越來越大，其中一個(gè)常見的需求就是在不刷新頁面的情況下，通過鼠標(biāo)滑動加載更多的文章。這時(shí)候，jQuery就是開發(fā)者們的好幫手。
//獲取到滾動條的位置
$(window).scroll(function(){
var scrollTop = $(this).scrollTop();
//獲取到頁面內(nèi)容的高度
var docHeight = $(document).height();
//獲取到可視區(qū)域的高度
var windowHeight = $(this).height();
//當(dāng)滾動條滑到底部時(shí)
if(docHeight - (scrollTop + windowHeight)< 50) {
//發(fā)送ajax請求獲取更多數(shù)據(jù)
$.ajax({
url: 'load-more.php',
type: 'post',
dataType: 'json',
data: {page:page},
success: function(data) {
//如果有更多的數(shù)據(jù)
if(data.length >0) {
//將獲取到的新數(shù)據(jù)添加到頁面中
for(var i=0; i'+data[i].title+'
'+data[i].content+'
以上代碼就是實(shí)現(xiàn)鼠標(biāo)滑動加載更多的核心代碼，通過監(jiān)聽滾動條的位置來觸發(fā)ajax請求，獲取更多的數(shù)據(jù)，然后將新數(shù)據(jù)添加到頁面中。需要注意的是，當(dāng)沒有更多的數(shù)據(jù)時(shí)，要移除滾動事件，否則會一直發(fā)送ajax請求。