ajax实现无刷新分页(php)
程序员文章站
2022-04-19 09:25:26
复制代码 代码如下:
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
<html>
<head>
<title>投票结果</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function getxmlhttpobject()
{
var xmlhttp=null;
try
{
// firefox, opera 8.0+, safari
xmlhttp=new xmlhttprequest();
}
catch (e)
{
// internet explorer
try
{
xmlhttp=new activexobject("msxml2.xmlhttp");
}
catch (e)
{
xmlhttp=new activexobject("microsoft.xmlhttp");
}
}
return xmlhttp;
}
function checkajax(){
xmlhttp=getxmlhttpobject()
if (xmlhttp==null)
{
alert ("您的浏览器不支持ajax！");
return ;
}else
{
return xmlhttp;
}
}
function preshow(){
ajaxobj = checkajax();
var url = "page.php?page=1";
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint1(str)
{
ajaxobj = checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint2(str)
{
ajaxobj=checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint3(str)
{
ajaxobj=checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint4(str)
{document.getelementbyid("msg").style.display="none";
ajaxobj=checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function statechanged()
{
if (xmlhttp.readystate==4)
{
document.getelementbyid("message").innerhtml=xmlhttp.responsetext;
}
}
</script>
</head>
<body onload="preshow()">
<div id="wrapper">
<h4>用户留言如下：</h4>
<div id="message">
</div>
</div>
</body>
</html>
<?php
$link = mysql_connect('localhost', 'root', '') or die(mysql_error());
mysql_select_db('vote', $link) or die(mysql_error());
mysql_query("set names utf8");
$num = 3;
$url = "page.php";
$con = "<ul id='msg'>";
$page = (isset($_request['page'])) ? $_request['page'] : 1;
$offset = ($page - 1) * $num;
$result = mysql_query("select count(*) from client");
$total = mysql_fetch_row($result);
$total = $total[0];
$pagenum = ceil($total / $num);
$page = min($pagenum, $page); //获得首页
$prepg = $page - 1; //上一页
if ($prepg <= 1)
$prepg = 1;
$nextpg = ($page == $pagenum ? 1 : $page + 1); //下一页
//如果只有一页则跳出函数：
if ($pagenum <= 1)
return false;
$sql = "select `name`,`content` from `client` limit " . $offset . "," . $num;
$res = mysql_query($sql);
while ($content = mysql_fetch_row($res)) {
$con .= "<li><span>$content[0]:</span> $content[1]</li>";
}
$con .= "</ul>";
$con .= <<< page
<p id="page"><a href="#" id="first" onclick="showhint1('$url?page=1')">首页</a>|<a href="#" id="pre" onclick="showhint2('$url?page=$prepg')">上一页</a>|<a href="#" id="next" onclick="showhint3('$url?page=$nextpg')">下一页</a>|<a href="#" id="last" onclick="showhint4('$url?page=$pagenum')">尾页</a></p>
page;
echo $con;
?>
复制代码 代码如下:
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
<html>
<head>
<title>投票结果</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function getxmlhttpobject()
{
var xmlhttp=null;
try
{
// firefox, opera 8.0+, safari
xmlhttp=new xmlhttprequest();
}
catch (e)
{
// internet explorer
try
{
xmlhttp=new activexobject("msxml2.xmlhttp");
}
catch (e)
{
xmlhttp=new activexobject("microsoft.xmlhttp");
}
}
return xmlhttp;
}
function checkajax(){
xmlhttp=getxmlhttpobject()
if (xmlhttp==null)
{
alert ("您的浏览器不支持ajax！");
return ;
}else
{
return xmlhttp;
}
}
function preshow(){
ajaxobj = checkajax();
var url = "page.php?page=1";
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint1(str)
{
ajaxobj = checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint2(str)
{
ajaxobj=checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint3(str)
{
ajaxobj=checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function showhint4(str)
{document.getelementbyid("msg").style.display="none";
ajaxobj=checkajax();
document.getelementbyid("msg").innerhtml="正在读取数据……";
var url = str;
ajaxobj.onreadystatechange=statechanged;
ajaxobj.open("get",url,true);
ajaxobj.send(null);
}
function statechanged()
{
if (xmlhttp.readystate==4)
{
document.getelementbyid("message").innerhtml=xmlhttp.responsetext;
}
}
</script>
</head>
<body onload="preshow()">
<div id="wrapper">
<h4>用户留言如下：</h4>
<div id="message">
</div>
</div>
</body>
</html>
复制代码 代码如下:
<?php
$link = mysql_connect('localhost', 'root', '') or die(mysql_error());
mysql_select_db('vote', $link) or die(mysql_error());
mysql_query("set names utf8");
$num = 3;
$url = "page.php";
$con = "<ul id='msg'>";
$page = (isset($_request['page'])) ? $_request['page'] : 1;
$offset = ($page - 1) * $num;
$result = mysql_query("select count(*) from client");
$total = mysql_fetch_row($result);
$total = $total[0];
$pagenum = ceil($total / $num);
$page = min($pagenum, $page); //获得首页
$prepg = $page - 1; //上一页
if ($prepg <= 1)
$prepg = 1;
$nextpg = ($page == $pagenum ? 1 : $page + 1); //下一页
//如果只有一页则跳出函数：
if ($pagenum <= 1)
return false;
$sql = "select `name`,`content` from `client` limit " . $offset . "," . $num;
$res = mysql_query($sql);
while ($content = mysql_fetch_row($res)) {
$con .= "<li><span>$content[0]:</span> $content[1]</li>";
}
$con .= "</ul>";
$con .= <<< page
<p id="page"><a href="#" id="first" onclick="showhint1('$url?page=1')">首页</a>|<a href="#" id="pre" onclick="showhint2('$url?page=$prepg')">上一页</a>|<a href="#" id="next" onclick="showhint3('$url?page=$nextpg')">下一页</a>|<a href="#" id="last" onclick="showhint4('$url?page=$pagenum')">尾页</a></p>
page;
echo $con;
?>