Php 不断刷新聊天记录_Php_Jquery_Html_Mysql_Ajax

Php 不断刷新聊天记录

php jquery html mysql ajax

Php 不断刷新聊天记录,php,jquery,html,mysql,ajax,Php,Jquery,Html,Mysql,Ajax,我在不断刷新聊天时遇到问题我就是这样建造的：我将所有消息保存在与PHP连接的MySQL数据库中，用PHP加载消息并用PHP发布消息，我让jQuery在单击submit时生成消息并将其发送到聊天室我的问题是，当我和朋友聊天时，每次有人写东西时，我们都必须刷新网站。我想让聊天室不断刷新。我尝试了$（'#example'）.load（document.URL+'#example'）但它不起作用，有人能帮我吗 [HTML] <!doctype html> <html lan

我在不断刷新聊天时遇到问题

我就是这样建造的：

我将所有消息保存在与PHP连接的MySQL数据库中，用PHP加载消息并用PHP发布消息，我让jQuery在单击submit时生成消息并将其发送到聊天室

我的问题是，当我和朋友聊天时，每次有人写东西时，我们都必须刷新网站。我想让聊天室不断刷新。我尝试了

$（'#example'）.load（document.URL+'#example'）但它不起作用，有人能帮我吗
[HTML]
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>ChatBox</title>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js" charset="utf-8"></script>
    <script>
        $(document).ready(function(){
            $("#content").load("ajaxload.php");

            $("a.btn").click(function(){
                $.post('ajaxPost.php', $('#userarea').serialize(), function(data){
                        $('#content').append('<p>'+data+'</p>');
                });
                return false;
            });

        });
    </script>
    <script src="chatbox.js" charset="utf-8"></script>
    <link href='http://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="chatbox.css" title="ChatBox" type="text/css" media="screen" charset="utf-8">
</head>
<body>
    <h1 id="swegre">
        SWEGRE<span>&copy;</span>
    </h1>
    <div id="wrapper">
        <h1>Leave a comment!</h1>
        <div id ="content">
            <p style="background-color: #b7b7b7">Admin: Here's our chatbox</p>
        </div>

        <div id="message">
            <form id="userarea">
            <textarea id="textareamsg" name="messages" rows="2" cols="30" required=""></textarea>
            <a href="#" class="btn">POST</a>
            </form>
        </div>

    </div>
</body>
</html>


语音聊天室
$（文档）.ready（函数（）{
$（“#content”）.load（“ajaxload.php”）；
$（“a.btn”）。单击（函数（）{
$.post（'ajaxPost.php'，$（'#userarea'）.serialize（），函数（数据）{
$（“#内容”）。追加（“”+数据+”）；
});
返回false；
});
});
SWEGRE©；
请留言！
管理员：这是我们的聊天室

[CSS不重要]
[jQuery]
$（文档）.ready（函数（）{
$（“a.btn”）。单击（函数（）{
var textValue=$（'textarea#textareamsg'）.val（）；
如果（textValue==“”| | textValue==“”| | textValue==“”| | textValue==“”）{
提醒（“你必须在文本区写些东西才能发布消息”）；
返回false；
}否则{
$（“#内容”）。追加（You:“+textValue+””；
$（'textarea#textareamsg'）.val（''）；
}
});
});

[AjaxLoad.php]
<?php
//conection:
$link = mysqli_connect("localhost","root","123","chat") or die("Error " . mysqli_error($link));

//consultation:

$query = "SELECT * FROM messages" or die("Error in the consult.." . mysqli_error($link));

//execute the query.

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

//display information:

while($row = mysqli_fetch_array($result)) {
  echo '<p class="other">';
  echo $row ["message"] . '</p>';
}
?> 



[AjaxPost]
<?php
$link = mysqli_connect("localhost","root","123","chat") or die("Error " . mysqli_error($link));

//consultation:

$query = "SELECT * FROM messages" or die("Error in the consult.." . mysqli_error($link));

//execute the query.

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

//Code goes here

$message = $_POST['messages'];

mysqli_query($link,"INSERT INTO messages (message)
VALUES ('$message')");
?>

使用ajax重新加载聊天室div
台阶
寓意：每10秒调用一次ajax
您可以使用microsoft技术：。其理念是使用幕后WebSocket。如果不能使用WebSockets，它将转而使用“连续”响应。您是否尝试过创建一个无限循环？你可以将其设置为1ms，虽然对于聊天，我建议可能为100或200ms。我应该针对整个页面还是仅针对div？因为如果我以整个页面为目标，就不可能写一些我不懂ajax的东西，你能给我看一段代码让我理解吗？非常感谢。
<?php
$link = mysqli_connect("localhost","root","123","chat") or die("Error " . mysqli_error($link));

//consultation:

$query = "SELECT * FROM messages" or die("Error in the consult.." . mysqli_error($link));

//execute the query.

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

//Code goes here

$message = $_POST['messages'];

mysqli_query($link,"INSERT INTO messages (message)
VALUES ('$message')");
?>

1. Make a chat div
2. Make  a ajax call every 10 sec
3. Design a  new page called chat.php
4. Update the chat data as per the db.