0

私は誰かのためにプロジェクトに取り組んでいます。現在、左側に YouTube ビデオ、右側にコメント ボックスの 2 つの div を含むページを作成しています。Facebookの機能によく似ています。ログインしているユーザーは、テキストエリア内にコメントを入力して [コメント] ボタンを押すことで、ビデオにコメントすることもできます。ページが更新され、コメントがコメント ボックスに表示されます。

ただし、ここに問題があります。ページが更新されると、ビデオの再生が停止します。コメント ボックスで 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 を使用して 2 番目の div だけを更新する方法はありますか?

4

2 に答える 2

1

jquery のload()関数を使用して、ロードするコンテンツを指定できます。

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

もちろん、コメントも ajax 経由で送信する必要があります。したがって、別のオプションは、ajax を使用してコメントを送信し、それが機能したことを確認して返信し、javascript を使用してコメント リストにコメントを追加することです。

補足として、XSSを防ぐためにコメントをエンコードしている場所がわかりません。そうすることを忘れないでください。

于 2013-07-28T18:08:31.607 に答える
0

これを実現する最善の方法は、jquery の $.ajax メソッドを使用することです。これにより、ページをリロードすることなく、コメントを投稿したり、コメントを読んだり更新したりできます。PHP に "getMusicComments" メソッドが既にあるように見えるので、そのメソッドを ajax で呼び出してコメントを取得するのはかなり簡単なはずです。

ここでjquery $.ajaxを読んでください

于 2013-07-28T18:10:26.690 に答える