为什么重新加载特定部分不起作用？

Question

我尝试了不同的代码，但代码总是不起作用。我想每 5 秒只重新加载特定部分，而不是重新加载整个页面。重要的是不要刷新整个页面，因为它包含聊天功能。如果我要重新加载整个页面，人们就无法输入文本而不每 5 秒丢失一次。就像我说的，我尝试了一些来自 stackOverflow 的代码，但不知何故它们对我不起作用。

这是我的代码

<script type="text/javascript">
                    $(document).ready(function(){
                        setInterval(function(){
                            $("#context").load(window.location.href + " #context" );
                        }, 5000);
                        
                     });
                          </script>

<--variables explained --->
$fid = $_GET['fid']
$username = $_SESSION['username']
$db :
$servername = "localhost";
$dbname = "psychopath";
$username = "root";
$password = "";

try{
    $dsn = "mysql:host=" . $servername . ";dbname=" . $dbname;
    $db = new PDO($dsn, $username, $password);
    echo "";
}catch(PDOException $e){
    echo $e.getMessage();
}
<--- variables END ----->



$display_messages = $db->prepare("SELECT * FROM mychat_from WHERE (user_to_name = ? OR userfrom_name = ?) AND (user_to_id = ? OR userfrom_id = ?)");
                $display_messages->execute([$username , $username, $fid, $fid]);
                while($row=$display_messages->fetch(PDO::FETCH_ASSOC)){
                    $userfrom = $row['userfrom'];
                        if($userfrom != $username){
                            $messagefrom2 = $row['message_from'];
                            $messagefrombreak2 = wordwrap($messagefrom2, 27, "\n", true);
                            ?>
                            
                                <?php
                      ?><section id="context" name="context"><?php echo '<b>&nbsp;'.$userfrom.'</b>said:<br>';
                    echo "<section style='background: black; float: left; margin-left: 5px; border-radius: 7px; color: white;'>&nbsp;<font style='float: left;'> &nbsp;".$messagefrombreak2."</font></section>";?>
                     </section>
                    <?php echo "<br><br>";
                    ?>

这是完整的代码：

<!-- end snippet -->if(isset($_GET['fid'])){
    $fid = $_GET['fid'];

      ?>
    <section>
        <section>
            <?php 
            $get_friend = $db->prepare("do stuff");
            $get_friend->execute([$fid]);
            while($row=$get_friend->fetch(PDO::ROW STUFF)){
            
            }
            ?>
        </section>
        <section>
            <?php
            $username = $_SESSION['username'];
            $get_id = $db->prepare("do stuff");
            $get_id->execute([$fid]);

            while($row=$get_id->fetch(ROW STUFF)){
                
            $get_your_id = $db->prepare("do stugg");
               $get_your_id->execute([$username]);
               while($row=$get_your_id->fetch(ROW STUFF)){

            $display_messages = $db->prepare("DO STUFF");
            $display_messages->execute([$your_id, $your_id, $fid, $fid]);
            while($row=$display_messages->fetch(DO STUFF)){
                $userfrom = $row['userfrom'];
                    if($userfrom != $username){
                        $messagefrom2 = $row['message_from'];
                        $messagefrombreak2 = wordwrap($messagefrom2, 27, "\n", true);
                        ?>
                        
                            <?php
                  ?><div id="container" name="container"><div id="context" name="context"><?php echo '<b>&nbsp;'.$userfrom.'</b>said:<br>';
                echo "<section style='background: black; float: left; margin-left: 5px; border-radius: 7px; color: white;'>&nbsp;<font style='float: left;'> &nbsp;".$messagefrombreak2."</font></section>";?>
                 </div></div>
                <?php echo "<br><br>";
                ?>
                
            <script type="text/javascript">
                   $(document).ready(function(){
                    setInterval(function(){
                        $("#context").load(window.location.href + " #container" );
                    }, 5000);
                   });
                      </script>      
                    <?php
                
            }else{
                $messagefrom = $row['message_from'];
                        $messagefrombreak = wordwrap($messagefrom, 27, "\n&nbsp;&nbsp;", true);
                echo "<font style='float: right;'><b>You </b>said:&nbsp; &nbsp;</font><br>";
                echo "<section style='background: #960505; float: right; margin-right: 5px; border-radius: 7px; color: 
                white;'><font style='float: right;'>&nbsp; ".$messagefrombreak."&nbsp; &nbsp; &nbsp;</font></section><br><br>"; 
    }}}}       
            ?>

        </section>

Answer 1

使用 ajax 和 json

ajax 在页面内调用服务器
json小简单格式
使用setInterval

喜欢

var myVar = setInterval(my_func, 5000);

my_func 是一个将持有 ajax 动作的函数。做你需要的事