0

如何将评论,喜欢,分享,时间选项显示为facebook?

我创建了一个类似于 Facebook 的帖子系统,如下图所示[感谢 SO 的人]:

我的墙

我无法正确放置内容。在哪里以及如何调整?

我希望它看起来类似于 Facebook 的帖子部分。

脸书墙

如何显示评论,喜欢,分享选项如上?

代码:index.php:

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$('#submit').on('click',function(e){
 e.preventDefault();
 input=$('#message').val();
 var comment={};
 comment.input=input;

 var commentdata=$("message").val();
  $.ajax({
        type: "POST",
                     data:{ 
            comment: commentdata
                },
        url: "ajax.php",
        success: function(data, textStatus){
            //alert(data);
            $("#commentsholder").append(data);
            $('#comments').append(comment.input);
            }
        },'html');
   });
});
</script>
</head>
<body>
<lable>Add post </lable><br>
<textarea id="message" rows="4" cols="50" placeholder="Add post"> </textarea>
<input type="submit" id="submit" value="share"> </input>
<div>
<div id="commentsholder"></div>
<ul id="comments" ></ul>
</div>
</body>
</html>

ajax.php:

<?php
$comment=$_POST['commentdata'];

$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=100005809179068";

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


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

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

2 回答 2

2

1.首先,为什么帖子和评论不能正常显示?!

您应该将 ajax 调用更改为:

$.ajax({
    type: "POST",
    data:{ 
        comment: commentdata,
        input: comment.input // Add your input as a parameter
    },
    url: "ajax.php",
    success: function(data, textStatus){
        $("#commentsholder").append(data);
    }
 },'html');

你的ajax.php:

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

它现在应该可以工作了。您的头像将始终与您的评论保持在同一块中。

2、二、加Like | 评论 | 分享。您可以在服务器端 ajax 或客户端中执行此操作,如下所示(我重用成功回调):

success: function(data, textStatus){
                $("#commentsholder").append(data); // This should append the div.comment
                $('.comment').append(comment.input); // Not $('#comments')
                var likeLink = '<a href="http://www.facebook.com/plugins/like.php?href=[YOUR_POST_URL]&width=100&height=80&colorscheme=light&layout=standard&action=like&show_faces=true&send=false&appId=[YOUR_APPID]">Like</a>';
                var shareLink = '<a title="send to Facebook" href="http://www.facebook.com/sharer.php?u=YOUR_URL" target="_blank">Share</a>';
                $('.comment').append(likeLink).append(shareLink);
                }

你可以在这里使用小提琴:http: //jsfiddle.net/karmiphuc/SDSwk/

关于帖子评论,您必须使用 FB Graph API 来发送和检索它们。

希望这可以帮助。

于 2013-10-25T07:52:32.253 回答
1

将其添加到代码的这一部分

echo '<div class="comment"><img src="'.$row ['picture'].'"/>'.$row ['name'].'</div><br />Comment | Share | etc...';
于 2013-10-25T07:16:04.930 回答