Question

我正在为某个人开展一个项目。目前我正在构建一个包含2个div的页面，左侧是YouTube视频，右侧是注释框。它看起来很像facebook功能。登录的用户还可以通过在textarea中键入注释并按“注释”按钮来对视频发表评论。然后页面将刷新，注释将显示在注释框中。

然而，这是问题所在;当页面刷新时，视频停止播放。有没有办法用评论框刷新div？

我知道我的代码不是很整洁，但这只是一个概念证明，所以不用担心。

获取视频的代码

echo "<div id='video' style='float:left; margin-right: 5px;'>";
$video_id = $_GET['i'];
$getinfo    =    new Music();
$getinfo = $getinfo->getMusicInfo($video_id);
if($getinfo){
?>
<object width="425" height="350" data="http://www.youtube.com/v/<?php echo $getinfo['link']; ?>" type="application/x-shockwave-flash"><param name="src" value="http://www.youtube.com/v/<?php echo $getinfo['link'];?>" /></object></div>

这是为了获得对视频的评论。

<div id='comment_area' style='border: 1px solid green; height: 300px;'>
        <div id='comments' style='border: 1px solid blue; height:180px; overflow-y: scroll;'>
        <?php
        $getcomments = new Music();
        $getcomments = $getcomments->getMusicComments($video_id);
        if($getcomments){
            foreach($getcomments as $comment){
                echo "<br /><a href='#'>" . $comment['stagename'] . "</a><br />" . $comment['comment'] . "<br /><br />";
            }
        }
        else {echo "<br />No comments yet. Be the first to comment<br />";} ;?>
        <span id='response'></span>
        <input type='hidden' id='music_id' value='<?php echo $video_id;?>' />
        <input type='hidden' id='user' value='<?php echo $_SESSION['user'];?>' /></div><br />
        <textarea cols=50 rows=7 id='comment_box' placeholder='Comment on this'></textarea><br />
        <input type='submit' onclick="addComment()" value='add comment'>
    </div>

那么有没有办法使用jQuery / javascript刷新第二个div？

Answer 1

您可以使用jquery的load()函数并指定要加载的内容：

$('#comment_area').load('mypage.php #comment_area');

当然，您还需要通过ajax提交评论。所以另一个选择是使用ajax提交评论，然后发回确认它有效，并且只需使用javascript将评论附加到评论列表。

作为旁注，我不知道您在哪里编码您的评论以防止XSS。别忘了这样做。

Answer 2

实现这一目标的最佳方法是使用jquery的$ .ajax方法。这将允许您发布注释并读取/更新注释，而无需重新加载页面。因为看起来你的php中已经有了“getMusicComments”方法，所以使用ajax调用该方法来检索注释应该相当简单。

阅读jquery $ .ajax here

jQuery刷新div

2 个答案: