javascript - AJAX:用收集到的数据中的特定 div 替换 div 的内容

Question

对我来说这看起来是正确的，但我丝毫没有使用 AJAX 的经验，坚持了几个小时尝试了许多变体，包括过滤器，但都没有用。这就是我目前拥有的，我看不出有什么问题。

发生的情况是，如果我只是刷新页面，聊天消息不会像往常一样显示。

如果有任何相关性的话，我只是想完成一个聊天界面。

这是正在发生的事情的一个活生生的例子:http://www.mixpix.eu/chat/chat.php?r=G97NxXy4exbLQPFU

$(document).ready(function() {
            var interval = setInterval(function() { 
                $.ajax({
                    dataType: "html",
                    url: 'chat.php?r=' + <?php echo "'" .$_GET['r']. "'"; ?> , 
                    success: function(data) {
                        var trim = $(data).find('.message_window');
                        $('.message_window').replaceWith(trim);
                    }
                });
            }, 1000);
});

这是我的 body 标签的内容:

<div class="wrapper">
        <div class"inbox_window" id="style-3">

        </div>
        <div class="message_window" id="style-3">
            <table width="100%">
                <p class="talking_to"><?php echo getFirstnamebyID($_GET['r']); ?></p>
                <?php echo displayMessages(); ?>
            </table>
        </div>
        <form class="submit_form" method="post" <?php echo 'action="chat.php?r='.$_GET['r'].'"' ?>>
            <input type="text" name="message" placeholder="Type message here" />
            <input type="submit" value="Send" name="s_say"/>
        </form>
    </div>

php 中的 displayMessages() 函数:

function displayMessages() {
    $user_id = getUserID();
    $sql = mysql_query(strip_tags("SELECT * FROM inbox WHERE (send_id='".$user_id."' OR send_id='".$_GET['r']."') AND (rec_id='".$_GET['r']."' OR rec_id='".$user_id."') ORDER BY timestamp;"));
    if (mysql_num_rows($sql) != 0) {
        while($row = mysql_fetch_assoc($sql)) {
            if ($row['send_id'] == $user_id) {
                echo '<tr><td><p class="sm">'. $row['messages'] .'</p></td></tr>';
            } else if ($row['send_id'] == $_GET['r']) {
                echo '<tr><td><p class="rm">'. $row['messages'] .'</p></td></tr>';
            } else {
                echo "Unable to display messages.";
            }
        }
    } else {
        echo "Be the first to say hello!";
    }
}

我会非常感谢任何人的帮助，因为它让我有点疯狂。

Answer 1

这里发生的一些事情会给你带来麻烦......

在 JavaScript 方面，setInterval 是一种让您的内容保持最新的 hacky 方式，这可以通过套接字更好地实现。如果你真的想这样做，返回整个文档(包括 HTML head)不是你最好的选择——也许发送一个额外的查询参数告诉你的 PHP 只发送消息部分，或者更好的是，自您上次检查时间戳以来添加的消息。

在您的标记中，您不能将段落标记直接放在您的表格或原始文本中，因为可以从您的 PHP 返回。无论如何，您并没有真正将它用作表格，列表可能更具语义。