Question

网上有很多用于评论系统的脚本。但我觉得这很混乱。当我们想要定制它时，它就像洞一样。

我想创建自己的简单评论框，用户可以在其中发帖和评论。

这是我输入帖子的空间：http://jsfiddle.net/karimkhan/FNcs8/

<lable>Add post </lable><br>
<textarea rows="4" name="Addpost" cols="50" placeholder="Add post"> </textarea>
<input type="submit" value="share"> </input>

现在点击按钮我可以存储在数据库中，但是当用户输入帖子和点击按钮时，如何向下显示？使用ajax是jquery，它既高效又容易我想在帖子附近显示用户图片。网址来自下表。

数据来源的表格是：

CREATE TABLE `user_record` (
  `id` varchar(40) NOT NULL,
  `name` varchar(50) DEFAULT NULL,
  `email` varchar(50) DEFAULT NULL,
  `picture` varchar(50) default NULL  //url for picture
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

伙计们，我将整个系统放在github上，这也有助于其他人学习。需要帮助！

更新1： ajax.php - 用于数据库

<?php

$con = mysqli_connect('127.0.0.1:3306', 'root', 'root', 'test');
if (mysqli_connect_errno()) {
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$query= "select * from user_record where id=1660546353";

$result = mysqli_query($con,$query);


//build html format as you need it..
while($row = mysqli_fetch_array($result)){

echo '<div class="comment">'.$row ['name'].'<img src="'.$row ['picture'].'"/></div>';
}
?>

Answer 1

如果您使用的是jquery，请使用此代码

HTML

<label>Add post </label><br>
<textarea id="message" rows="4" cols="50" placeholder="Add post"> </textarea>
<input type="submit" id="submit" value="share"> </input>
<div id="commentsholder"></div>

的Javascript

<script type="text/javascript">
$(document).ready(function(){

$('#submit').on('click',function(){
 var commentdata=$("message").val();
  $.ajax({
        type: "POST",
                     data:{ 
            comment: commentdata
                },
        url: "ajax.php",
        success: function(data, textStatus){
            //alert(data);
            $("#commentsholder").append(data);
            }
        },'html');
   });
});
</script>

在ajax.php中

//insert comment into database.
//get the user content who are posting it.
<?php

$con = mysqli_connect('127.0.0.1:3306', 'root', 'root', 'test');
if (mysqli_connect_errno()) {
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$query= "select * from user_record where id=1660546353";

$result = mysqli_query($con,$query);


//build html format as you need it..
while($row = mysqli_fetch_array($result)){

echo '<div class="comment">'.$row ['name'].'<img src="'.$row ['picture'].'"/></div>';
}
?>

就是这样......它应该有效

Answer 2

更好地使用jquery。你可以做的是将ur textarea置于div标签内，然后你可以动态改变div.use javascript的位置，以便每次按下提交按钮时更改div标签的名称。然后你可以使用我在网上找到的以下jquery代码最适合你的问题。当你发布新评论时，旧文章将在逻辑上向下移动我们正在交换他们的位置。

$('.div2:parent').each(function () {
$(this).insertBefore($(this).prev('.div1'));
});

如果你想要任何澄清请告诉我。

Answer 3

你可以使用这种方法我希望这会对你有所帮助： -

放置一个块（ul），当你的textarea上方没有评论或你的小提琴中的文字输入时，它会被隐藏。

<ul id="comments" style="display:none"></ul>

<lable>Add post </lable><br>
<textarea  id="cmntinput" rows="4" name="Addpost" cols="50" placeholder="Add post"> </textarea>
<input id="submitbtn" type="submit" value="share"> </input>

现在使用jquery ajax作为提交/点击事件

$('#submitbtn').click(function(e)
 {
    e.preventDefault();

    input=$('#cmntinput').val();

    var comment={};

    comment.input=input;

    $.ajax({

            url: 'path/to/php',

            data: comment,

            type: 'POST'

            success: function()

            {


                  $('#comments').append('<li id="cmnt">'+input+</li>)

                  //apply some css changes to `li#cmnt or ul#comments`

                  $('li#cmnt').css({listStleType: 'none'}) //example

                  $('#comments')fadeIn()

            }

            })

           })

你必须使用php来获取正在评论的用户数据，例如，如果这是基于登录的像facebook等网站，你可以在登录时创建会话，并可以在$_SESSION成功登录时存储用户名。在将在ajax调用上运行的php脚本中，您可以像

一样编写

session_start();
user=$_SESSION['userid'];

//retrieve data on the basis of userid from table where you are storing user info like name email etc

//on the basis of retrieved data insert the `$_POST['input']`(comment) in appropriate table

如果你想在附加的新评论中显示用户名，日期等，请使用php为你准备整个字符串

$output="<li id='cmnt'><ul><li id='name'>".$data['name']."<li id='content'>".$_POST['input']."</li></ul></li>


     //$data[] is the array to store user information that you have retrieved about user

并回复并将其用作附加到ul#comments

的ajax成功的响应

Answer 4

我希望你有基本的HTML和数据库。我希望这个链接可以帮到你

http://tutorialzine.com/2010/06/simple-ajax-commenting-system/

评论系统 - 创建帖子并在页面上显示-1

4 个答案: