PHP+Ajax实现分页技术
PHP+Ajax实现分页技术:
基于php和ajax的分页技术代码,下面有两个php文件,一个是sn_inq.php,另一个是sn_show.php,前一个php文件调用后一个php文件,实现ajax分页,运行sn_inq即可实现效果,不过得修改数据库哦。具体代码如下:红色标注的地方要特别注意修改哦!
我的数据库名是inv,表名是sn,字段有:sn_id,sn_plant,sn_sales,sn_act,sn_type,sn_sts.....
1.sn_inq.php
//getFormValue 用于获取表单中所有输入控件的值,并将输入值组成一个字符串传到服务器。
//showcomment(page) 用于显示分页数据,被查询按钮onclick 事件调用, url为后台处理数据并输出XML格式数据的文件url。
function showcomment(page) {
var x = new Ajax('statusid', 'XML');
url = 'sn_show.php?page='+page+'&'+getFormValue(document.form1);
x.get(url , function(s) {
if(s.lastChild){
getbyid("show").innerHTML = "Loading……";
getbyid("show").innerHTML = s.lastChild.firstChild.nodeValue;
removeLoading(document.getElementById("show"));
}
else{
document.form1.submit();
}
});
}
//displayLoading用于显示Loading,提示用户等待
function displayLoading(element) {
var image = document.createElement("img");
image.setAttribute("src","progressbar.gif");
image.setAttribute("title","loading...");
var text = document.createTextNode("loading……");
element.appendChild(image);
element.appendChild(text);
}
//removeLoading用于去掉Loading
function removeLoading(element){
var image = element.getElementsByTagName("img");
for(var i=0;i
}
}
//ajax
function Ajax(statusId, recvType) {
var aj = new Object();
displayLoading(document.getElementById("show"));
var clientHeight = scrollTop = 0;
if(navigator.userAgent.toLowerCase().indexOf('opera') > -1) {
clientHeight = document.body.clientHeight;
scrollTop = document.body.scrollTop;
} else {
clientHeight = document.documentElement.clientHeight;
scrollTop = document.documentElement.scrollTop;
}
if(document.getElementById(statusId)) {
aj.statusId = document.getElementById(statusId);
document.getElementById(statusId).style.top = 10+"px";
} else {
var divElement = document.createElement("DIV");
divElement.id = "xspace-tipDiv";
divElement.className = "xspace-ajaxdiv";
divElement.style.cssText = "width:200px; height:40px; line-height: 40px; text-align: center;";
divElement.style.left = 10+"px";
divElement.style.top = 10+"px";//(clientHeight +scrollTop - 60)
divElement.id = statusId;
document.body.appendChild(divElement);
aj.statusId = divElement;
}
aj.targetUrl = '';
aj.sendString = '';
aj.recvType = recvType ? recvType : 'HTML';//HTML XML
aj.resultHandle = null;
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
request = new ActiveXObject(versions[i]);
if(request) {
return request;
}
} catch(e) {
//alert(e.message);
}
}
}
return request;
}
aj.XMLHttpRequest = aj.createXMLHttpRequest();
aj.processHandle = function() {
aj.statusId.style.display = '';
if(aj.XMLHttpRequest.readyState == 4) {
if(aj.XMLHttpRequest.status == 200) {
if(aj.recvType == 'HTML') {
aj.resultHandle(aj.XMLHttpRequest.responseText);
} else if(aj.recvType == 'XML') {
aj.resultHandle(aj.XMLHttpRequest.responseXML);
}
aj.statusId.style.display = 'none';
} else {
aj.statusId.innerHTML = xml_http_load_failed;
}
}
}
aj.get = function(targetUrl, resultHandle) {
aj.targetUrl = targetUrl;
aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
aj.resultHandle = resultHandle;
if(window.XMLHttpRequest) {
aj.XMLHttpRequest.open('GET', aj.targetUrl);
aj.XMLHttpRequest.send(null);
} else {
aj.XMLHttpRequest.open("GET", targetUrl, true);
aj.XMLHttpRequest.send();
}
}
aj.post = function(targetUrl, sendString, resultHandle) {
aj.targetUrl = targetUrl;
aj.sendString = sendString;
aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
aj.resultHandle = resultHandle;
aj.XMLHttpRequest.open('POST', targetUrl);
aj.XMLHttpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
aj.XMLHttpRequest.send(aj.sendString);
}
return aj;
}
function getbyid(id) {
if (document.getElementById) {
return document.getElementById(id);
} else if (document.all) {
return document.all[id];
} else if (document.layers) {
return document.layers[id];
} else {
return null;
}
}
//注意:此处如果有filesedset的话,form表单一定要放在fieldset里面,否则出错。
echo '
';
?>
2.sn_show.php:
//page function
function showpage(total){
global page,pagenav,middle,num,pagenum,offset,prepg,nextpg;
//获取page=18中的page的值,假如不存在page,那么页数就是1。
page=isset(_REQUEST['page'])?intval(_REQUEST['page']):1;
//每层分页条显示4个分页连接
middle = '4';
//每页显示10条数据
num=10;
//获得总页数,也是最后一页
pagenum=ceil(total/num);
//获得首页
page=min(pagenum,page);
//上一页
prepg=page-1;
//下一页
nextpg=(page==pagenum ? 0 : page+1);
offset=(page-1)*num;
if(pagenum
if(prepg){
pagenav.=' onclick="javascript:showcomment(1);">'.iconv('gb2312','gb2312','首页').' ';
pagenav.=' onclick="javascript:showcomment('.prepg.');">'.iconv('gb2312','gb2312','上一页').' ';
}else{
pagenav.="".iconv('gb2312','gb2312','首页').""." ";
pagenav.="".iconv('gb2312','gb2312','上一页')."";
}
if(nextpg){
pagenav.=' onclick="javascript:showcomment('.nextpg.');">'.iconv('gb2312','gb2312','下一页').' ';
pagenav.=' onclick="javascript:showcomment('.pagenum.');">'.iconv('gb2312','gb2312','尾页').' ';
}else{
pagenav.="".iconv('gb2312','gb2312','下一页').""." ";
pagenav.="".iconv('gb2312','gb2312','尾页').""." ";
}
pagenav.=''.iconv('gb2312','gb2312','共 ') . pagenum .' '.iconv('gb2312','gb2312','页');
for(h=(page-middlepagenum?pagenum:page+middle);h++){
if(h==page){
pagenav.=" h ";
}else{
pagenav.=" ".iconv('gb2312','gb2312',h)." ";
}
}
pagenav.=" ";
pagenav.=iconv('gb2312','gb2312','转到 ');
pagenav.="";
pagenav.="页";
return pagenav;
}
//connect to database
function db_link()
{
access_id = "root";
db_name = "inv";
@ db = mysql_connect('localhost', access_id, '831025') or
die("Could not connect to database. Please contact with IT supporting team ASAP.");
mysql_query("SET NAMES 'GBK'");
mysql_select_db(db_name);
return db;
}
link = db_link();
//get inquiry criteria,用 POST取得数据也行
sn_id_1 = _REQUEST['sn_id_1'];
sn_id_2 = _REQUEST['sn_id_2'];
//inquiry total pages
sn_sql = "SELECT * FROM sn WHERE 1 ";
if (sn_id_1 != ''){
sn_sql .= "AND sn_id >= '".sn_id_1."' ";
}
if (sn_id_2 != ''){
sn_sql .= "AND sn_id
}
sn_sql .= "ORDER BY sn_id DESC ";
sn_res = mysql_query(sn_sql);
total = mysql_num_rows(sn_res);
//show page
pageshow = showpage(total);
//inquiry current page
sn_sql .= " limit offset,num";
sn_res = mysql_query(sn_sql);
sn_num = mysql_num_rows(sn_res);
//output inquiry result as XML
header("Content-Type: text/xml");
if(total > 0){
echo '';
echo '
echo '
echo '';
echo ']]>';
echo '
}else{
echo 'find nothing';
}
?>

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Safe Exam Browser
Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

EditPlus Chinese cracked version
Small size, syntax highlighting, does not support code prompt function

ZendStudio 13.5.1 Mac
Powerful PHP integrated development environment

PhpStorm Mac version
The latest (2018.2.1) professional PHP integrated development tool

WebStorm Mac version
Useful JavaScript development tools
