留言页面添加功能

1,留言添加功能前端展示

这里需要引入kindeditor编辑器,百度下载一个引进js文件如下:

<script src="kindeditor/kindeditor/kindeditor-all.js"></script>

并在内容里添加如下代码:(#content对应着id属性)

    <script>
                   KindEditor.ready(function(K) {
                       window.editor = K.create('#content',{
                           afterBlur:function(){this.sync();}
                       })
           
                   });
      </script>

即可,具体代码如下所示:

<!DOCTYPE html>
<html>
    <head>
        <title>留言板</title>
        <meta charset="UTF-8">
        <script src="kindeditor/kindeditor/kindeditor-all.js"></script>
    </head>
    <body>
        <div><h1>留言板</h1></div>
        <div>
            <form action="insertdb.php" method="post">
                标题:<input type="text" id="title" name="title"><br>
                内容:<br><span><textarea name="content" rows="13" cols="80" id="content"></textarea>
                <script>
                    KindEditor.ready(function(K) {
                        window.editor = K.create('#content',{
                            afterBlur:function(){this.sync();}
                        })
                    });
                </script>
                </span>
                <input type="submit" name="dosub" id="btn" value="上传留言">
            </form>
        </div>
    </body>
</html>

页面展示如下:

微信图片_20180308095345.png

2,提交请求处理

新建insertdb.php:

代码如下:

<?php
include './mysqli.php';
header('Content-type:text/html;charset=utf-8');
$tit=$_POST["title"];
$con=$_POST["content"];
$sql="insert into message(title,content) values('$tit','$con')";
if($mysqli->query($sql))
{
    echo "留言成功,3秒后跳转原页面";
}else{
    echo "留言失败,3秒后跳转原页面";
}
header("Refresh:3;url=message.php");

3,效果如下图所示:

gif5新文件 (18).gif

大家可以思考下如何用ajax无刷新页面来做添加功能?(下一节将介绍)

继续学习
||
<?php echo "留言添加功能";
提交重置代码
章节
笔记
提问
课件
反馈
捐赠

PHP留言板设计

  • 推荐课程
  • 评论
  • 问答
  • 笔记
  • 课件下载

的Q我

3个月前    添加回复 0

回复

18674060620

<form action="insertdb.php" method="post"> 标题:<input type="text" id="title" name="title"><br> 内容:<br><span><textarea name="content" rows="13" cols="80" id="content"></textarea> <script> KindEditor.ready(fonction(K){ window.editor = K.create('#content',{ afterBlur:function(){this.sync(); } }) }) </script> </span> <input type="submit" name="dosub" id="btn" value="上传留言"> </form>

3个月前  0

课件暂不提供下载,工作人员正在整理中,后期请多关注该课程~