非主流留言板代码(html php mysql实现留言板功能)

功能描述:

1)实测链接的是远程数据库

2)打开留言板加载留言

3)新添加的留言显示在下方

css代码,用于设置弹框和新添加的留言样式等

style type="text/css"

#comments{

margin:10px auto;

}

#post{

margin-top:10px;

}

#comments p,

#post p{

line-height:30px;

}

#comments p span{

margin:4px;

color:#bdb8b8;

}

#message{

position: absolute;

top: 40%;

left: 100px;

width: 200px;

height: 50px;

background: #f2f2f2;

border: 1px solid;

border-radius: 3px;

line-height: 50px;

text-align: center;

display: none;

}

/style

html代码:

div

div id="post"

h3文章评论/h3

p昵称:/p

pinput type="text" class="input" id="user" //p

p评论内容:/p

ptextarea class="input" id="txt" style="width:100%; height:80px"/textarea/p

pinput type="submit" class='btn'value="发表" id="add" //p

div id="message"/div

/div

div id="comments"/div

/div

js代码,用于加载留言

script type="text/javascript" src="https://js/jquery.js"/script

script type="text/javascript"

$(function() {

var comments = $("#comments");

$.getJSON("data.php", function(json) {

$.each(json, function(index, array) {

var txt = "pstrong" array "/strong:" array "span" array "/span/p";

comments.append(txt);

});

});

//将评论的内容展出

$("#add").click(function() {

var user = $("#user").val();

var txt = $("#txt").val();

$.ajax({

type: "POST",

url: "comment.php",

data: "user=" user "txt=" txt,

dataType : 'JSON',

success: function(res) {

if (resde == 1) {

var str = "pstrong" reser "/strong:" res.txt "span刚刚/span/p";

comments.append(str);

$("#message").show().html("发表成功!").fadeOut(1000);

$("#txt").attr("value", "");

} else {

$("#message").show().html(res.message).fadeOut(1000);

}

}

});

});

});

/script

connect.php文件,用于连接数据库

?php

$host="your db host";

$db_user="your db";

$db_pass="your db password";

$db_name="your db name";

$timezone="Asia/Shanghai";


$link=mysqli_connect($host,$db_user,$db_pass);//连接数据库主机

mysqli_select_db($link,$db_name);//选择数据库

mysqli_query($link,"SET names UTF8");//设置数据库编码格式


header("Content-Type: text/html; charset=utf-8");//设置头部样式

date_default_timezone_set($timezone); //北京时间

data.php,用于打开网页时展示留言

?php

include_once("connect.php");//连接数据库


$q=mysqli_query($link,"select * from comments");//获取数据库的数据

while($row=mysqli_fetch_array($q)){

$comments = array("id"=$row,"user"=$row,"comment"=$row,"addtime"=$row);

}

echo json_encode($comments);//以json格式编码

comment.php,用于将新的留言存入数据库并展示在视图上

?php

include_once("connect.php");

//trim,返回字符串 str 去除首尾空白字符后的结果。如果不指定第二个参数,则去除普通控制,制表符,换行符,回车符,空字节符,垂直制表符

//htmlspecialchars() 函数把预定义的字符转换为 HTML 实体

$user = htmlspecialchars(trim($_POST));

$txt = htmlspecialchars(trim($_POST));

if(empty($user)){

$data = array("code"=355,"message"="昵称不能为空!");

echo json_encode($data);

exit;

}

if(empty($txt)){

$data = array("code"=356,"message"="内容不能为空");

echo json_encode($data);

exit;

}

$time = date("Y-m-d H:i:s");

$query=mysqli_query($link,"insert into comments(user,comment,addtime)values('$user','$txt','$time')");

if($query) {

$data = array("code" = 1, "message"="success","user" = $user , "txt" = $txt);

echo json_encode($data);

}

另外,还有在数据库中创建comment的sql命令

CREATE TABLE `comments`(

`id` int(4) NOT NULL AUTO_INCREMENT PRIMARY KEY,

`user` varchar(50),

`comment` varchar(200),

`addtime` datetime not null

)engine=MYISAM CHARACTER SET UTF8 COLLATE utf8_unicode_ci;