欢迎来到 黑吧安全网 聚焦网络安全前沿资讯,精华内容,交流技术心得!

Ajax与mysql数据交互制作留言板功能的方法介绍

来源:本站整理 作者:佚名 时间:2017-05-01 TAG: 我要投稿

最近自己做了一个小demo,实现了Ajax与MySQL的数据交互,js部分用的是jq,后台用的是php,数据库是mysql,过时间再来一个node+mongodb版的。
关于mysql的使用和安装,就不多讲了,自行百度xampp,Apache服务器和mysql数据库集成,非常好用。
首先打开服务器和数据库,我这里先建立了一个“eleven”的数据库,下面建立了一个叫做microblog的表(请注意:我这里使用的是高版本的mysql,里面php链接数据库的方法使用的都是mysqli_ 如果版本过低,请使用mysql_ 方法,自行修改代码)
以下是代码部分:
html页面和js部分:
 
 
 
  
  微博留言板
  
   *{
    margin: 0;
    padding: 0;
   }
   #box{
    width: 600px;
    /*height: 500px;*/
    border: 2px solid rgb(85,85,85);
    border-radius: 15px;
    margin: 50px auto;
    padding: 20px 10px 15px;
    background-color: rgb(85,85,85);
   }
   #content{
    display: block;
    resize: none;
    width: 550px;
    height: 200px;
    margin: 0 auto;
    border: 2px solid rgb(225,225,225);
    border-radius: 10px;
    text-align: center;
    font-size: 30px;
    background-color: rgb(225,225,225);
   }
   #content:focus{
    outline: none;
    border: 2px solid rgb(225,225,225);
    box-shadow: 0 0 15px rgb(225,225,225);
   }
   #btn{
    border: 2px solid rgb(255,204,0);
    width: 80px;
    height: 40px;
    border-radius: 5px;
    margin-top: 30px;
    font-size: 17px;
    cursor: pointer;
    outline: none;
    background-color: rgb(255,204,0);
   }
   
   .list{
    list-style: none;
    background-color: rgb(249,249,249);
    margin-top: 20px;
   }
   .list>li{
    padding: 20px 10px 10px;
    border-bottom: 2px solid rgb(68,68,68);
    font-size: 20px;
    color: rgb(200,214,225);
    position: relative;
    word-break: break-word;
    word-wrap: break-word;
    background-color: rgb(85,85,85);
    
   }
   .list>li>.control{
    position: absolute;
    bottom: 3px;
    right: 5px;
    font-size: 14px;
   }
   .list>li>p{
    margin-bottom: 25px;
   }
   .control span,.control em{
    display: inline-block;
    margin-right: 15px;
   }
   .control em{
    color: darkblue;
    cursor: pointer;
   }
   a{
    text-decoration: none;
    color: darkred;
   }
   #page>a{
    display:inline-block;
    width: 40px;
    height: 30px;
    margin-top: 10px;
    text-align: center;
    line-height: 30px;
    font-size: 20px;
    border-radius: 5px;
    color: white;
    background-color: rgb(51,21,70);
   }
   #head{
    color: rgb(200,214,225);
    font-size: 30px;
    height: 50px;
    border-bottom: 2px solid rgb(68,68,68);
    margin-bottom: 20px;
   }
  
 
 
  
   
    留言板
   
   
    
    提交留言
   
   
   
    
    
   
   
   
    1
    2
   
  
 
 
 
代码显示不完,下面是php部分代码。

[1] [2] [3]  下一页

【声明】:黑吧安全网(http://www.myhack58.com)登载此文出于传递更多信息之目的,并不代表本站赞同其观点和对其真实性负责,仅适于网络安全技术爱好者学习研究使用,学习中请遵循国家相关法律法规。如有问题请联系我们,联系邮箱admin@myhack58.com,我们会在最短的时间内进行处理。
  • 最新更新
    • 相关阅读
      • 本类热门
        • 最近下载