头像

Ajax应用:jQuery+PHP+MySQL发表评论

来源:http://phprr.com/show-388 a***n 2018-05-04 12:50:21浏览() 收藏

jQuery+PHP+MySQL发表评论留言板
Ajax应用:jQuery+PHP+MySQL发表评论
分类: >PHP/Mysql >留言评论
查看演示 下载资源: 1 下载资源 下载积分: 70 积分

1元=10积分 1元=1码币,全栈客服QQ357058607,在线充值

HTML

首先我们放置一个评论表单和显示评论列表#comments

<div id="post">  
   <h3>发表评论</h3>  
   <p>昵称:</p>  
   <p><input type="text" class="input" id="user" /></p>  
   <p>评论内容:</p>  
   <p><textarea class="input" id="txt" style="width:100%; height:80px">

               

jQuery

接着调用评论列表,并且通过Ajax发布评论:

$(function() { 
    var comments = $("#comments"); 
    $.getJSON("ajax.php"
    function(json) { 
        $.each(json, 
        function(index, array) { 
            var txt = "<p><strong>" + array["user"] + "</strong>:" + array["comment"] + "<span>" + array["addtime"] + "</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, 
            success: function(msg) { 
                if (msg == 1{ 
                    var str = "<p><strong>" + user + "</strong>:" + txt + "<span>刚刚</span></p>"
                    comments.append(str); 
                    $("#message").show().html("发表成功!").fadeOut(1000); 
                    $("#txt").attr("value"""); 
                } else { 
                    $("#message").show().html(msg).fadeOut(1000); 
                } 
            } 
        }); 
    }); 
});

               

Mysql

最后附上表comments结构:

CREATE TABLE `comments` (  
  `id` int(11) NOT NULL auto_increment,  
  `user` varchar(30) NOT NULL,  
  `comment` varchar(200) NOT NULL,  
  `addtime` datetime NOT NULL,  
  PRIMARY KEY  (`id`)  
) ENGINE=MyISAM;



腾讯云服务器安全可靠高性能,多种配置供您选择

https://cloud.tencent.com/redirect.php?redirect=1001&cps_key=b685b398d3e704662203733b89accc52&from=console

阿里云服务器安全可靠高性能,多种配置供您选择

https://promotion.aliyun.com/ntms/act/qwbk.html?userCode=geqqrf2n


标签: ajax 评论 留言
最新交易
评论2
头像

评论后赠送5积分,下载出错或者资源有问题请联系全栈客服QQ 357058607

  • 头像
    2019-10-01 20:49:25
    x****e
    70积分,不知道有没有后台管理?
  • 头像
    2019-10-01 20:44:14
    x****e
    请问这个有后台管理吗?
1 2