87,910
社区成员
发帖
与我相关
我的任务
分享求助修改一段js代码效果
下面是一段无刷新加载下一页的代码，每次都要点击才能加载下一页，求大神帮忙把它改为像今日头条首页那样页面下拉无刷新加载下一页，先谢谢了
<SCRIPT type=text/javascript language=JavaScript src="/js/jquery.min.js"></SCRIPT>
<ul id="alist">
<li>
自定义标题
</li>
<li>
自定义标题
</li> <li>
自定义标题
</li> </ul>
<div id="ajaxshow"></div>
<div id="a_pg">
<div id="ajaxld"></div>
<a id="ajnt" href="forum.php?mod=forumdisplay&fid={$_G[fid]}&filter={$filter}&orderby={$_GET[orderby]}{$forumdisplayadd[page]}&{$multipage_archive}" onclick="return ajaxpage(this.href);">点击加载下一页</a>
</div>
<script type="text/javascript">
function jq(id) {
return !id ? null : document.getElementById(id);
}
function Ajax(recvType, waitId) {
var aj = new Object();
aj.recvType = recvType ? recvType : 'XML';
aj.createXMLHttpRequest = function() {
var request = false;
if(window.XMLHttpRequest) {
request = new XMLHttpRequest();
if(request.overrideMimeType) {
request.overrideMimeType('text/xml');
}
} else if(window.ActiveXObject) {
var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
for(var i=0; i<versions.length; i++) {
try {
request = new ActiveXObject(versions[i]);
if(request) {
return request;
}
} catch(e) {}
}
}
return request;
};
aj.XMLHttpRequest = aj.createXMLHttpRequest();
aj.showLoading = function() {
if(aj.waitId && (aj.XMLHttpRequest.readyState != 4 || aj.XMLHttpRequest.status != 200)) {
aj.waitId.style.display = '';
aj.waitId.innerHTML = '<span style="dis"><img src="' + IMGDIR + '/loading.gif" class="vm"> ' + aj.loading + '</span>';
}
};
aj.processHandle = function() {
if(aj.XMLHttpRequest.readyState == 4 && aj.XMLHttpRequest.status == 200) {
if(aj.waitId) {
aj.waitId.style.display = 'none';
}
if(aj.recvType == 'HTML') {
aj.resultHandle(aj.XMLHttpRequest.responseText, aj);
} else if(aj.recvType == 'XML') {
if(!aj.XMLHttpRequest.responseXML || !aj.XMLHttpRequest.responseXML.lastChild || aj.XMLHttpRequest.responseXML.lastChild.localName == 'parsererror') {
aj.resultHandle('<a href="' + aj.targetUrl + '" target="_blank" style="color:red">内部错误，无法显示此内容</a>' , aj);
} else {
aj.resultHandle(aj.XMLHttpRequest.responseXML.lastChild.firstChild.nodeValue, aj);
}
} else if(aj.recvType == 'JSON') {
var s = null;
try {
s = (new Function("return ("+aj.XMLHttpRequest.responseText+")"))();
} catch (e) {
s = null;
}
aj.resultHandle(s, aj);
}
}
};
aj.get = function(targetUrl, resultHandle) {
targetUrl = hostconvert(targetUrl);
setTimeout(function(){aj.showLoading()}, 250);
aj.targetUrl = targetUrl;
aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
aj.resultHandle = resultHandle;
var attackevasive = isUndefined(attackevasive) ? 0 : attackevasive;
if(window.XMLHttpRequest) {
aj.XMLHttpRequest.open('GET', aj.targetUrl);
aj.XMLHttpRequest.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
aj.XMLHttpRequest.send(null);
} else {
aj.XMLHttpRequest.open("GET", targetUrl, true);
aj.XMLHttpRequest.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
aj.XMLHttpRequest.send();
}
};
return aj;
}
function getHost(url) {
var host = "null";
if(typeof url == "undefined"|| null == url) {
url = window.location.href;
}
var regex = /^\w+\:\/\/([^\/]*).*/;
var match = url.match(regex);
if(typeof match != "undefined" && null != match) {
host = match[1];
}
return host;
}
function hostconvert(url) {
if(!url.match(/^https?:\/\//)) url = SITEURL + url;
var url_host = getHost(url);
var cur_host = getHost().toLowerCase();
if(url_host && cur_host != url_host) {
url = url.replace(url_host, cur_host);
}
return url;
}
</script>
<script type="text/javascript">
var pages=1;
var allpage=6;
function ajaxpage(url){
jq("ajaxld").style.display='block';
jq("ajnt").style.display='none';
var x = new Ajax("HTML");
pages++;
url=url+'&page='+pages;
x.get(url, function (s) {
s = s.replace(/\\n|\\r/g, "");//alert(s);
s = s.substring(s.indexOf("<ul id=\"alist\""), s.indexOf("<div id=\"ajaxshow\"></div>"));//alert(s);
jq('ajaxshow').innerHTML+=s;
jq("ajaxld").style.display='none';
if(pages==allpage){
jq("a_pg").style.display='none';
}else{
jq("ajnt").style.display='block';
}
});
return false;
}
</script>
...全文
请发表友善的回复…
发表回复
qq_36497287 2016-10-26
- 打赏
- 举报
谢谢
门_玻璃_天花板 2016-10-24
- 打赏
- 举报
先把数据全部请求下来, 存到变量中, 当页面下拉到一定高度, 再加载已有的数据...代码的话, 你可以去参考下MUI的下拉刷新(PS:用HBuilder打开就可以创建MUI应用)
qq_36497287 2016-10-24
- 打赏
- 举报
版主老大，我把你这个js代码放上去无效啊，是我放的不对还是htm里面还要加什么代码才行吗
Go 旅城通票 2016-10-24
- 打赏
- 举报
var viewHeight, scrolllHeight;
window.onresize = function () {
viewHeight = document[document.compatMode == 'CSS1Compat' ? 'documentElement' : 'body'].clientHeight;
scrollHeight = document[document.compatMode == 'CSS1Compat' ? 'documentElement' : 'body'].scrollHeight;
document.getElementById('dvBT').innerHTML = '<br>scrollHeight：' + scrollHeight + '<br>viewHeight：' + viewHeight;
}
window.onresize();
window.onscroll = function () {
var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
if(scrollTop + viewHeight >= scrollHeight )document.getElementById('ajnt').onclick();
}
qq_36497287 2016-10-24
- 打赏
- 举报
我完全是小白，版主你帮我添加一下判断的代码吧，谢谢了
Go 旅城通票 2016-10-24
- 打赏
- 举报
js判断已经滚动到页面底部
判断滚动到页低就触发你的加载下一页事件就好了
