<!--------------------------------------------HTML代码------------------------------------------------------>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<title>JQuery+php+mysql结合</title>
<style type="text/css">
h3{font-size:14px}
comments{margin:10px auto}
post{margin-top:10px}
comments p,#post p{line-height:30px}
comments p span{margin:4px; color:#999}
message{position:relative; display:none; margin-top:-100px; margin-left:30px;
background:#369; color:#fff; z-index:1001}
</style>
</head>
<body>
<div id="comments">
<h3>读取评论</h3>
</div>
<div id="post">
<h3>发表评论</h3>
<p>昵称:</p>
<p><input type="text" class="input" id="user" /></p>
<p>评论内容:</p>
<p><textarea class="input" id="txt" style="width:160px; height:80px"></textarea></p>
<p><input type="submit" value="发表" id="add" /></p>
<div id="message"></div>
</div>
<script>
$(function(){
var comments = $("#comments");
$.getJSON("server.php",function(json){
$.each(json,function(index,array){
var txt = "<p><strong>"+array["user"]+"</strong>:"+array["comment"]+"<span>"
+array["addtime"]+"</span></p>";
comments.append(txt);
});
});
});
$("#add").click(function(){
var user = $("#user").val();
var txt = $("#txt").val();
$.ajax({
type: "POST",
url: "comments.php",
data: "user="+user+"&txt="+txt,
success: function(msg){
if(msg==1){
var str = "<p><strong>"+user+"</strong>:"+txt+"<span>刚刚</span></p>";
comments.append(str);
$("#message").show().html("发表成功!");
$("#txt").attr("value","txt");
}else{
$("#message").show().html(msg);
}
}
});
});
</script>
</body>
</html>
<!--------------------------HTML代码结束----------------------------------------->
===============================连接数据库========================================
<?php
$a=mysql_connect('localhost','root','') or die("数据库连接失败,请核实你的数据库的 '地址','用户名','密码' ,谢谢你的支持");
mysql_select_db(huiyuan,$a)or die("连接数据库失败,请核实数据库是否存在");
mysql_query("set names UTF8 ");
mysql_close($a);
?>=============================================================================================================================server.PHP===============================================
<?php
include_once("conn.php");
$sql="select * from comments";
while($row=mysql_fetch_array($sql)){
$comments[] = array("id"=>$row[id],"user"=>$row[user],"comment"=>$row[comment],
"addtime"=>$row[addtime]);
}
echo json_encode($comments);
?>
==================================================================================================================================comments.PHP==================================================================
<?php
include_once("conn.php");
$user = htmlspecialchars(trim($_POST['user']));
$txt = htmlspecialchars(trim($_POST['txt']));
if(empty($user)){
echo "昵称不能为空!";
exit;
}
if(empty($txt)){
echo "评论内容不能为空!";
exit;
}
$time = date("Y-m-d H:i:s");
$query="insert into comments(user,comment,addtime)values('$user','$txt','$time')";
if($query) echo "1";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<title>JQuery+php+mysql结合</title>
<style type="text/css">
h3{font-size:14px}
comments{margin:10px auto}
post{margin-top:10px}
comments p,#post p{line-height:30px}
comments p span{margin:4px; color:#999}
message{position:relative; display:none; margin-top:-100px; margin-left:30px;
background:#369; color:#fff; z-index:1001}
</style>
</head>
<body>
<div id="comments">
<h3>读取评论</h3>
</div>
<div id="post">
<h3>发表评论</h3>
<p>昵称:</p>
<p><input type="text" class="input" id="user" /></p>
<p>评论内容:</p>
<p><textarea class="input" id="txt" style="width:160px; height:80px"></textarea></p>
<p><input type="submit" value="发表" id="add" /></p>
<div id="message"></div>
</div>
<script>
$(function(){
var comments = $("#comments");
$.getJSON("server.php",function(json){
$.each(json,function(index,array){
var txt = "<p><strong>"+array["user"]+"</strong>:"+array["comment"]+"<span>"
+array["addtime"]+"</span></p>";
comments.append(txt);
});
});
});
$("#add").click(function(){
var user = $("#user").val();
var txt = $("#txt").val();
$.ajax({
type: "POST",
url: "comments.php",
data: "user="+user+"&txt="+txt,
success: function(msg){
if(msg==1){
var str = "<p><strong>"+user+"</strong>:"+txt+"<span>刚刚</span></p>";
comments.append(str);
$("#message").show().html("发表成功!");
$("#txt").attr("value","txt");
}else{
$("#message").show().html(msg);
}
}
});
});
</script>
</body>
</html>
<!--------------------------HTML代码结束----------------------------------------->
===============================连接数据库========================================
<?php
$a=mysql_connect('localhost','root','') or die("数据库连接失败,请核实你的数据库的 '地址','用户名','密码' ,谢谢你的支持");
mysql_select_db(huiyuan,$a)or die("连接数据库失败,请核实数据库是否存在");
mysql_query("set names UTF8 ");
mysql_close($a);
?>=============================================================================================================================server.PHP===============================================
<?php
include_once("conn.php");
$sql="select * from comments";
while($row=mysql_fetch_array($sql)){
$comments[] = array("id"=>$row[id],"user"=>$row[user],"comment"=>$row[comment],
"addtime"=>$row[addtime]);
}
echo json_encode($comments);
?>
==================================================================================================================================comments.PHP==================================================================
<?php
include_once("conn.php");
$user = htmlspecialchars(trim($_POST['user']));
$txt = htmlspecialchars(trim($_POST['txt']));
if(empty($user)){
echo "昵称不能为空!";
exit;
}
if(empty($txt)){
echo "评论内容不能为空!";
exit;
}
$time = date("Y-m-d H:i:s");
$query="insert into comments(user,comment,addtime)values('$user','$txt','$time')";
if($query) echo "1";
?>
<script>
$(function(){
var comments = $("#comments");
$.getJSON("server.php",function(json){
$.each(json,function(index,array)
{
var txt = "<p><strong>"+array["user"]+"</strong>:"+array["comment"]+"<span>"
+array["addtime"]+"</span></p>";
comments.append(txt);
});
}); $("#add").click(function(){
var user = $("#user").val();
var txt = $("#txt").val();
$.ajax({
type: "POST",
url: "comments.php",
data: "user="+user+"&txt="+txt,
success: function(msg)
{
if(msg==1)
{
var str = "<p><strong>"+user+"</strong>:"+txt+"<span>刚刚</span></p>";
comments.append(str);
$("#message").show().html("发表成功!");
$("#txt").attr("value","txt");
}
else
{
$("#message").show().html(msg);
}
}
});
}); });
</script>