摘要:如果有其他需求,比如返回例子中直接返回,可以修改中的代碼,就不贅述了
今天在技術(shù)群看到有朋友有需求,就隨手寫了一個(gè),大家隨便看看~
demo地址:http://www.dtzhuanjia.com/pri...
(備注:這個(gè)主要用在移動(dòng)端,所以用rem隨便寫了寫樣式= =PC看著不舒服用模擬器看吧)
html:
下一頁 已經(jīng)加載的1-1已經(jīng)加載的1-2已經(jīng)加載的1-3已經(jīng)加載的1-4已經(jīng)加載的1-5
js代碼:
function InitNextPage(obj){ _this = this; _this.bottom = obj.bottom||10;//距離底部像素 _this.target = obj.target||"body";//插入目標(biāo)源 _this.url = obj.url||"none";//ajax請(qǐng)求的url _this.page = 2; //滑到底 $(window).scroll(function(){ _this.scrollToBottom(); }); } InitNextPage.prototype = { scrollToBottom : function(){ if($(window).scrollTop()+$(window).height()>$(document).height()-_this.bottom){ if(_this.url=="none"){ alert("ajax url不能為空"); return; } $.ajax({ url : _this.url, async: false, data : { page : _this.page, }, success : function(data){ _this.page++; $(_this.target).append(data); } }); } } }
備注:
var initNextPage = new InitNextPage({ bottom : 20,//距離底部像素 target : ".main",//插入目標(biāo)源 url : "http://www.dtzhuanjia.com/private/plugin/nextpage/nextPage.php"http://ajax請(qǐng)求的url })
上面代碼中:
bottom是距離底部多少像素時(shí)執(zhí)行ajax,默認(rèn)10
target是執(zhí)行成功后,像哪個(gè)dom插入返回的數(shù)據(jù),默認(rèn)為body
url是ajax url地址,必填。
如果有其他需求,比如返回json(例子中直接返回Html),可以修改success中的代碼,就不贅述了~
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/115440.html
摘要:如果有其他需求,比如返回例子中直接返回,可以修改中的代碼,就不贅述了 今天在技術(shù)群看到有朋友有需求,就隨手寫了一個(gè),大家隨便看看~demo地址:http://www.dtzhuanjia.com/pri...(備注:這個(gè)主要用在移動(dòng)端,所以用rem隨便寫了寫樣式= =PC看著不舒服用模擬器看吧) html: 下一頁 ...
摘要:如果有其他需求,比如返回例子中直接返回,可以修改中的代碼,就不贅述了 今天在技術(shù)群看到有朋友有需求,就隨手寫了一個(gè),大家隨便看看~demo地址:http://www.dtzhuanjia.com/pri...(備注:這個(gè)主要用在移動(dòng)端,所以用rem隨便寫了寫樣式= =PC看著不舒服用模擬器看吧) html: 下一頁 ...
摘要:引入文件頁面結(jié)構(gòu)控制翻屏邏輯直接跳到第頁設(shè)置滑動(dòng)頁面的統(tǒng)一樣式 引入touch.js文件 // Zepto.js // (c) 2010-2014 Thomas Fuchs // Zepto.js may be freely distributed under the MIT license. ;(function($){ var touch = {...
摘要:這個(gè)來的莫名其妙,問了一圈人也沒什么思路,后來自己上網(wǎng)搜,在一個(gè)頁面上找到一段關(guān)于的觸控板的手勢(shì)滑動(dòng)會(huì)瘋狂觸發(fā)滾輪事件的記錄,但是輪到具體的解決方案就語焉不詳了。 頭幾天官網(wǎng)剛上線,就接到投訴說有問題。過去一看,我靠什么鬼?!Mac下用觸控板一滑到底,——首頁上用iscroll寫的翻頁效果直接全軍覆沒。 這個(gè)bug來的莫名其妙,問了一圈人也沒什么思路,后來自己上網(wǎng)搜,在一個(gè)頁面上找到一...
摘要:起因昨天上知乎一看,發(fā)現(xiàn)自己關(guān)注的問題接近個(gè)了,不能忍,希望控制在個(gè)以以內(nèi)最好是個(gè)以內(nèi)。到問題詳情頁分析取消關(guān)注的格式,使用問題拼裝。功能說明把所有關(guān)注的問題列出來。而實(shí)際上知乎顯示我關(guān)注的問題有個(gè)。知乎的列表的結(jié)構(gòu)和接口都可能會(huì)修改。 起因 昨天上知乎一看,發(fā)現(xiàn)自己關(guān)注的問題接近1000個(gè)了,不能忍,希望控制在500個(gè)以以內(nèi)最好是100個(gè)以內(nèi)。于是打開我關(guān)注的問題列表。發(fā)現(xiàn)這個(gè)列表已...
閱讀 1069·2023-04-25 14:35
閱讀 2831·2021-11-16 11:45
閱讀 3421·2021-09-04 16:48
閱讀 2187·2021-08-10 09:43
閱讀 533·2019-08-30 13:17
閱讀 1627·2019-08-29 13:27
閱讀 892·2019-08-26 13:58
閱讀 2157·2019-08-26 13:48