PHP development message board tutorial message board publishing and display
Create the "ressage.php" file
We divided the page into three parts, one part is placed Our background image, part of it is to display our messages, and part of it is the page where we post our messages
We are The divs were laid out with CSS respectively, and the form content was judged by JS. In the message display section, paging was done. In the message section, we used JQ's hidden field effect.
The code is as follows
<?php
session_start();
header("content-type:text/html;charset=utf-8");
$page=isset($_GET['page']) ?$_GET['page'] :1 ;//接收頁碼
$page=!empty($page) ? $page :1;
$conn=mysqli_connect("localhost","root","root","Ressage");
mysqli_set_charset($conn,'utf8'); //設定字符集
$table_name="ressage_user";//查取表名設置
$perpage=5;//每頁顯示的數(shù)據(jù)個數(shù)
//最大頁數(shù)和總記錄數(shù)
$total_sql="select count(*) from $table_name";
$total_result =mysqli_query($conn,$total_sql);
$total_row=mysqli_fetch_row($total_result);
$total = $total_row[0];//獲取最大頁碼數(shù)
$total_page = ceil($total/$perpage);//向上整數(shù)
//臨界點
$page=$page>$total_page ? $total_page:$page;//當下一頁數(shù)大于最大頁數(shù)時的情況
//分頁設置初始化
$start=($page-1)*$perpage;
$sql= "select * from ressage_user order by id desc limit $start ,$perpage";
$result=mysqli_query($conn,$sql);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>留言板</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no" />
<style>
/*#left{*/
/*width: 25%;*/
/*float: left;*/
/*}*/
/*#center{*/
/*width: 42%;*/
/*float: left;*/
/*}*/
/*#right{*/
/*width: 32%;*/
/*float: left;*/
/*}*/
.right{
margin-left: 140px;
}
.button{
background-color: rgba(230, 228, 236, 0.93); /* Green */
border: none;
color: #110c0f;
padding: 10px 70px;
text-align: center;
display: inline-block;
font-size: 16px;
margin-left: 20px;
cursor: pointer;
}
form{
font-size: 17px;
}
button{
background-color: rgba(249, 247, 255, 0);
border: none;
font-size: 16px;
color: #551a8b;
cursor: pointer;
}
a{
text-decoration:none;
}
table{
width: 360px;
height: 100px;
}
</style>
<script>
$(document).ready(function(){
$("button").click(function(){
$("form").toggle();
});
});
function foo(){
if(myform.name.value=="")
{
alert("請輸入你的姓名");
myform.name.focus();
return false;
}
if (myform.content.value=="")
{
alert("留言內(nèi)容不能為空");
myform.content.focus();
return false;
}
if(myform.vcode.value==""){
alert('驗證碼不能為空');
myform.vcode.focus();
return false;
}
}
</script>
</head>
<body>
<div id="left">
<img src="https://img.php.cn/upload/image/460/147/285/1477727203382106.jpg" width="370px">
</div>
<div id="center">
<h1>留言內(nèi)容</h1>
<p>
<?
if($result==null){
echo"暫時沒有留言";
} ?>
</p>
<?php
while($row=mysqli_fetch_array($result)){
?>
<table border="1" cellspacing="0">
<tr>
<td>姓名：<?php echo $row['name']?></td>
<td style="text-align: center">留言時間:<?php echo $row['ressage_time']?></td>
<td><a href="ressage_delete.php?id=<?php echo $row['id']?>" >刪除</a> </td>
</tr>
<tr>
<td colspan="3">你的留言:<?php echo $row['content']?></td>
</tr>
</table>
<?php
}?>
<div id="baner" style="margin-top: 20px">
<a href="<?php
echo "$_SERVER[PHP_SELF]?page=1"
?>">首頁</a>
<a href="<?php
echo "$_SERVER[PHP_SELF]?page=".($page-1)
?>">上一頁</a>
<!-- 顯示123456等頁碼按鈕-->
<?php
for($i=1;$i<=$total_page;$i++){
if($i==$page){//當前頁為顯示頁時加背景顏色
echo "<a style='padding: 5px 5px;background: #000;color: #FFF' href='$_SERVER[PHP_SELF]?page=$i'>$i</a>";
}else{
echo "<a style='padding: 5px 5px' href='$_SERVER[PHP_SELF]?page=$i'>$i</a>";
}
}
?>
<a href="<?php
echo "$_SERVER[PHP_SELF]?page=".($page+1)
?>">下一頁</a>
<a href="<?php
echo "$_SERVER[PHP_SELF]?page={$total_page}"
?>">末頁</a>
<span>共<?php echo $total?>條</span>
</div>
</div>
<div id="right" >
<h2>留言板</h2>
<div > <a href="">首頁</a> | <button>留言</button> <a href="">管理員登錄</a>
<form method="post" action="ressage_post.php" style="display:none;" onsubmit="return foo();" name="myform" ">
<div>
<p>
姓名：<input type="text" name="name">
</p>
<p>
郵箱：<input type="email" name="email">
</p>
<p>
留言內(nèi)容：<br/>
<textarea cols="30" rows="7" name="content"></textarea>
</p>
<p>
驗證碼：<input type="text" name="vcode"><img src="yanzhengma.php" onClick="this.src='yanzhengma.php?nocache='+Math.random()" style="cursor:hand">
</p>
<p>
<button>提交留言</button>
</p>
</div>
</form>
</div>
</body>
</html>
