当前位置:首页 > 综合实例 > 列表

php+ajax实现无刷新的新闻留言系统

发布:smiling 来源: PHP粉丝网  添加日期:2021-06-22 09:49:23 浏览: 评论:0 

这篇文章主要介绍了一款基于php+ajax无刷新的新闻留言系统实现过程,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。

本文介绍了一款无刷新的新闻留言系统,最简明易懂的一个ajax无刷新留言系统,源码中省略了接受数据验证的过程,大家可根据自己的需求进行扩展,下面进入主题。

核心源码:

1.配置文件:config.php,代码如下:

  1. <?php  
  2.  //数据库配置信息(用户名,密码,数据库名,表前缀等)  
  3.  $cfg_dbhost = "localhost";  
  4.  $cfg_dbuser = "root";  
  5.  $cfg_dbpwd = "root";  
  6.  $cfg_dbname = "ajaxdemo1";  
  7.  $cfg_dbprefix = "";  
  8.  $link = mysql_connect($cfg_dbhost,$cfg_dbuser,$cfg_dbpwd);  
  9.  mysql_select_db($cfg_dbname);  
  10.  mysql_query("set names utf8");  
  11. ?> 

2.处理请求:deal.php,代码如下:

  1. <?php  
  2.  header("Content-type:text/html;charset=utf-8");  
  3.  include "config.php";  
  4.  //post接收数据,只是演示效果,这里就省去验证了  
  5.  $name = $_POST['name'];  
  6.  $content = $_POST['content'];  
  7.  $sql = "insert into test (name,content) values ('{$name}','{$content}');";  
  8.  $res = mysql_query($sql,$link);  
  9.  if($res){  
  10.  echo '{"name": "'.$name.'","content": "'.$content.'","status": "1"}';  
  11.  }  
  12. ?> 

3.首页代码:index.php,代码如下:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <title>无刷新</title>  
  6. <link href="css/css.css" type="text/css" rel="stylesheet" />  
  7. <style type="text/css">  
  8. body{color:#555;font-size:14px;padding:0;margin:0;}  
  9. #form { background:#dedede; padding:10px 20px; width:300px;}  
  10. #show{ background:#f6f6f6;padding:10px 20px; width:300px;}  
  11. #show p{ margin:6px; font-size:13px; line-height:22px; border-bottom:1px dashed #cdcdcd;}  
  12. </style>  
  13. <script type="text/javascript" src="jquery-1.7.2.min.js"></script>  
  14. <script type="text/javascript">  
  15. $(function(){  
  16.  $("#sub").click(function(){  
  17.  //只是说明原理,然后这里省去了验证文本框内容的步骤,直接发送ajax请求  
  18.  $.post("deal.php",{name : $("#name").val(), content : $("#content").val()}, function(data){  
  19.  if(data.status){  
  20.   var str = "<p><strong>"+data.name+"</strong> 发表了:"+data.content+"</p>";  
  21.   $("#show").prepend(str); //在前面追加  
  22.  }else{  
  23.   alert("评论失败");  
  24.  }  
  25.  }, 'json');  
  26.  });   
  27. });  
  28. </script>  
  29. </head>  
  30. <body>  
  31. <div id="form">  
  32.  <form action="deal.php" method="get" id="suggest_form">  
  33.  用户名:<input type="text" name="name" id="name" /><br/>  
  34.  内&nbsp;&nbsp;容:<textarea name="content" id="content"></textarea>&nbsp;&nbsp;  
  35.  <input type="button" value="发布" id="sub" />  
  36.  </form>  
  37. </div>  
  38. <div id="show">  
  39. <?php 
  40.  include "config.php";  
  41.  $sql = "select * from test;";  
  42.  $res = mysql_query($sql,$link);  
  43.  while($row=mysql_fetch_array($res)){  
  44.  echo "<p><strong>".$row['name']."</strong> 发表了:".$row['content']."</p>";  
  45.  }  
  46. ?>  
  47. </div>  
  48. </body>  
  49. </html>  

数据库文件,代码如下:

  1. DROP TABLE IF EXISTS `test`;  
  2. CREATE TABLE `test` (  
  3.  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,  
  4.  `namevarchar(64) NOT NULL,  
  5.  `content` text NOT NULL,  
  6.  PRIMARY KEY (`id`)  
  7. ) ENGINE=MyISAM DEFAULT CHARSET=utf8;  

以上就是为大家分享的php+ajax实现无刷新的新闻留言系统,希望对大家的学习有所帮助。

Tags: php+ajax无刷新新闻留言系统

分享到: