php留言板

最新推荐文章于 2022-06-10 00:28:14 发布

u010219209

最新推荐文章于 2022-06-10 00:28:14 发布

阅读量1.3k

点赞数

分类专栏：数据库网页前端 PHP 文章标签： ajax javascript

本文链接：https://blog.csdn.net/opensource_liu/article/details/40474577

版权

数据库同时被 3 个专栏收录

16 篇文章 0 订阅

订阅专栏

网页前端

4 篇文章 0 订阅

订阅专栏

PHP

1 篇文章 0 订阅

订阅专栏

1.在设计留言板是添加了一个点赞功能，可是一点赞，页面就回到顶端，解决办法是将herf里的#链接换成javascript:void(null)，点赞功能是通过Ajax技术和javascript实现的，javascript负责前台更新，Ajax负责更新数据库，这里会回到顶端的原因是浏览器以为链接到同一页，可它又找不到定义的书签(anchor)，于是会停留在页面的顶端

2.数据库语句：-- 数据库: `msgboard`;用户名root 密码1234
-- 表的结构 `liuyan`
CREATE TABLE `liuyan` (
`ID` int(11) NOT NULL auto_increment,
`MyDate` datetime NOT NULL,
`Msg` text collate utf8_bin NOT NULL,
`Zan` int(11) NOT NULL,
PRIMARY KEY (`ID`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_bin AUTO_INCREMENT=0 ;

3.代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>留言板</title>
<?php
function GetMsgNum()
{
$db_link=mysql_connect("localhost","root","1234")or die("不能连接到服务器".mysql_error());
mysql_select_db("msgboard",$db_link);
$result=mysql_query("select count(*) from liuyan",$db_link);
$row=mysql_fetch_array($result);
return $row[0];
}
?>
<style type="text/css">
.liuyan_text{
width:600px;
height:120px;
background-image:url(logo.gif);
background-repeat:no-repeat;
background-position:center;
margin-top:10px;
margin-left:22px;
resize:none;
}
</style>
<script type="text/javascript">
var xmlHttp
var PageIndex=0;
var msg_count="<?php echo GetMsgNum()?>";
var g_cmd;//全局指令
var code_result=0;//验证码计算值
function Check(str,cmd)
{
if(cmd=="save")
{
if(str.length>300)
{
alert('超出字数限制度,请精简留言');
return false;
}
if(str=="文明上网，不传谣言，敬请留言！")
{
alert('还没留言哦, 亲');
return false;
}
if(str.replace(/\n/g,"").replace(/ /g,"").length==0)//排除换行和空格干扰
{
alert('留言要有意义哦, 亲');
return false;
}
if(document.getElementById("coderesult").value!=code_result)
{
alert("验证码计算错误!");
document.getElementById("coderesult").value="";
return false;
}
}
if(cmd=="msgcount")
{
if(str==0)
{
alert("暂无留言！");
return false;
}
}
return true;
}

function CreateCode()
{
var operator = new Array('+','-','*');
var code=new Array();
var code_text="";
for(var i=0;i<5;i++)
{
if(i==1||i==3)
code[i]=operator[Math.floor(Math.random()*3)];
else
code[i]=Math.floor(Math.random()*10);
code_text=code_text+code[i];
}
if(code[3]=="*")
{
code_result=code[2]*code[4];
switch(code[1])
{
case "+":code_result=code[0]+code_result;break;
case "-":code_result=code[0]-code_result;break;
case "*":code_result=code[0]*code_result;break;
}
}
else
{
switch(code[1])
{
case "+":code_result=code[0]+code[2];break;
case "-":code_result=code[0]-code[2];break;
case "*":code_result=code[0]*code[2];break;
}
switch(code[3])
{
case "+":code_result=code_result+code[4];break;
case "-":code_result=code_result-code[4];break;
}
}
document.getElementById("code").innerHTML=code_text+"=";
}

function OutPut(str,cmd)
{
var url="CreateMsg.php";
g_cmd=cmd;
xmlHttp=GetXmlHttpObject();
if (xmlHttp!=null&&Check(str,cmd))
{
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
document.getElementById("content").style.display="block";
switch(cmd)
{
case "save":
{
CreateCode();//发布一次留言修改一下验证码，避免恶意留言
xmlHttp.send("msg="+str+"&cmd=save");
msg_count++;
document.getElementById("msgcount").innerHTML="留言"+msg_count+"条";
break;//保存留言
}
case "head":
case "msgcount":
{
PageIndex=5;
xmlHttp.send("msg="+PageIndex+"&cmd=head");
break;
}
case "next"://下到底就显示尾页
{
PageIndex+=5;
if(PageIndex>msg_count)
{
PageIndex=msg_count;
xmlHttp.send("msg=0&cmd=rear");
}
else
{
xmlHttp.send("msg="+PageIndex+"&cmd=next");
}
break;
}
case "prev":// 上到底就显示首页
{
PageIndex-=5;
if(PageIndex<=0)
{
PageIndex=0;
xmlHttp.send("msg=5&cmd=head");
}
else
{
xmlHttp.send("msg="+PageIndex+"&cmd=prev");
}
break;
}
case "rear":
{
PageIndex=0;
xmlHttp.send("msg="+PageIndex+"&cmd=rear");
break;
}
case "Zan":
{
xmlHttp.send("msg="+str+"&cmd=Zan");
var zan=parseInt(document.getElementById(str).text);
zan=zan+1;
document.getElementById(str).innerHTML=zan;
break;
}
}
}
}

function stateChanged()
{
/*
xmlHttp.readyState 取值及其含义
0：请求未初始化（还没有调用 open()）。
1：请求已经建立，但是还没有发送（还没有调用 send()）。
2：请求已发送，正在处理中（通常现在可以从响应中获取内容头）。
3：请求在处理中；通常响应中已有部分数据可用了，但是服务器还没有完成响应的生成。
4：响应已完成；您可以获取并使用服务器的响应了。
complete一般相对于js判断文件(图片、swf、脚本文件...)加载状态时使用
*/
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
if(g_cmd!="Zan")
document.getElementById("table").innerHTML=xmlHttp.responseText
}
}

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 HideTip()
{
//CreateCode();
if(liuyan.value=="文明上网，不传谣言，敬请留言！")//去掉提示和背景图片
{
liuyan.value="";
document.getElementById('liuyan').style.backgroundImage="url(null)";
}
}

function ShowTip()
{
if(liuyan.value=="")//显示提示和背景图片
{
liuyan.value="文明上网，不传谣言，敬请留言！";
document.getElementById('liuyan').style.backgroundImage="url('logo.gif')";
}
}

function DispTip()// 刷新提示
{
document.getElementById('tip').style.display="block";
}

function NonDisp()
{
document.getElementById('tip').style.display="none";
}

</script>
</head>
<body οnlοad="CreateCode()">
<div style="background-color:#F3F3F3; width:650px; height:220px; margin-left:100px">
<hr size="3" align="left" width="648px" color="#000000" style=" margin-top:0px"/>
<a style="margin-left:22px;">网友留言</a> <a id="msgcount" href="#" style="margin-left:560px; font-size:15px"; οnclick="OutPut(msg_count,'msgcount')"><?php echo "留言".GetMsgNum()."条"?></a>
<textarea id="liuyan" name="liuyan" class="liuyan_text" οnfοcus="HideTip()" οnblur="ShowTip()" >文明上网，不传谣言，敬请留言！</textarea>
<div style="margin-left:22px; margin-top:10px;font-size:15px;">
一键登录:
<a href="http://weibo.com/login.php">新浪微博</a>|
<a href="https://passport.csdn.net/account/login">CSDN</a>|
<a href="https://passport.weibo.com/othersitebind/authorize?entry=miniblog&site=qq">QQ</a>
  验证码:<b><a id="code" οnclick="CreateCode()" οnmοuseοver="DispTip()" οnmοuseοut="NonDisp()" style="background-image:url(code.jpg)">2+3+4=</a></b>
<input id="coderesult" style="width:30px; height:16px;" type="text" />
<a href="#" style="margin-left:0px">注册</a>|
<a href="#">忘记密码</a>
<input type="button" align="right" style="font-weight:bolder; margin-left:10px; font-size:14px; background-color:#9C9" value="发布留言" οnclick="OutPut(liuyan.value,'save')" />
</div>
</div>
<div id="tip" style=" font-size:12px; margin-left:420px; margin-top:-40px; float:left; position:absolute;display:none; background-color:#CCC">
点击刷新
</div>
<div id="content" style="display:none">
<div style="margin-left:100px">
最新留言:<hr size="2" align="left" width="648px" color="#9999CC" />
</div>
<pre>
<div id="table" style="background-color:#F3F3F3; width:650px; margin-left:100px; margin-top:-12px; word-wrap:break-word">
</div>
</pre>
<div align="center" style="width:650px;margin-left:100px; background-color:#FCF; margin-top:-32px">
<a href="javascript:void(null)" οnclick="OutPut(PageIndex,'head')">首页</a>
<a href="javascript:void(null)" οnclick="OutPut(PageIndex,'next')">下一页</a>
<a href="javascript:void(null)" οnclick="OutPut(PageIndex,'prev')">上一页</a>
<a href="javascript:void(null)" οnclick="OutPut(PageIndex,'rear')">尾页</a>
</div>
</div>
</body>
</html>

//PHP代码(CreateMsg.php)

<?php
function Limit($limit)
{
$db_link=mysql_connect("localhost","root","1234")or die("不能连接到服务器".mysql_error());
mysql_select_db("msgboard",$db_link);
$result=mysql_query("select ID,MyDate,Msg,Zan from liuyan order by MyDate desc,ID desc ".$limit,$db_link);
while($row=mysql_fetch_array($result))
{
echo "<b>游客".$row[ID]."留言:\t\t\t\t\t\t时间:".$row[MyDate]."</b>"."<br>".$row[Msg]."<p>";
echo "\t\t\t\t\t\t\t\t\t\t<b><a href='javascript:void(null)' οnclick=OutPut($row[ID],'Zan')>赞</a>【<a id=$row[ID]>$row[Zan]</a>】</b>";
echo "<hr size='1' align='left' width='648px' color='#000000'/>";
}
}

function SaveMsg($msg)
{
date_default_timezone_set('PRC');
$now_date=date(Yknkd)." ".date(Gxixs);
$now_date=str_replace("k", "-", $now_date);
$now_date=str_replace("x", ":", $now_date);

$db_link=mysql_connect("localhost","root","1234")or die("不能连接到服务器".mysql_error());
mysql_select_db("msgboard",$db_link);

$sql="insert into liuyan (MyDate,Msg,Zan) values('$now_date','$msg',0)";
if(mysql_query($sql))
{
Limit("limit 5");
}
else
echo mysql_error();
}

function DispMsg($cmd,$pageindex)
{
switch($cmd)
{
case "head":
{
Limit("limit 5");
break;
}
case "next":
case "prev":
{
$arg1=$pageindex;
Limit("limit ".$arg1.",5");
break;
}
case "rear":
{
$db_link=mysql_connect("localhost","root","1234")or die("不能连接到服务器".mysql_error());
mysql_select_db("msgboard",$db_link);
$result=mysql_query("select count(*) from liuyan",$db_link);
$row=mysql_fetch_array($result);
$arg1=$row[0]-5;
if($arg1<0)$arg1=0;
Limit("limit ".$arg1.",5");
break;
}
case "Zan":
{
$db_link=mysql_connect("localhost","root","1234")or die("不能连接到服务器".mysql_error());
mysql_select_db("msgboard",$db_link);
mysql_query("update liuyan set Zan=Zan+1 where ID=$pageindex");
}
}
}

$value=$_POST["msg"];
$cmd=$_POST["cmd"];
switch($cmd)
{
case "save":SaveMsg($value);break;//保存留言
default:DispMsg($cmd,$value);break;
}
?>