0

我在 PHP/jQuery/MySQL 中创建了一个相对简单的“想法板”。

在页面加载时，div #chat 会拉取数据库中的当前条目。

<div id="chat">
    <?php

    $sql = "SELECT * from idea ORDER BY id DESC;";
    $result = $pdo->query($sql);

    if($result->rowCount() > 0 && !empty($result))
    {
        foreach ($result as $row) 
        {
        $title = $row['title'];
        $idea = $row['idea'];

        echo '<span class="idea"><strong>' . $row['title'] . "</strong>&nbsp;-&nbsp;" . $row['idea'] . '&nbsp;<a class="delete" href="">[Delete]</a></span>';
        }
    }
  ?>
    </div>

但是，我希望使用以下方法定期刷新它：

<body onload="setInterval('chat.update()', 1000)">

下面的示例详细说明了如何使用文本文件完成它，我将如何查询数据库（该示例可在http://css-tricks.com/jquery-php-chat/找到）？

//Updates the chat
function updateChat() {
    if(!instanse){
        instanse = true;
        $.ajax({
            type: "POST",
            url: "process.php",
            data: {'function': 'update','state': state,'file': file},
            dataType: "json",
            success: function(data) {
                if(data.text){
                    for (var i = 0; i < data.text.length; i++) {
                        $('#chat-area').append($("

                        "+ data.text[i] +"

                        "));
                    }   
                }
                document.getElementById('chat-area').scrollTop = document.getElementById('chat-area').scrollHeight;
                instanse = false;
                state = data.state;
            }
        });
    }
    else {
        setTimeout(updateChat, 1500);
    }
}

我希望某些行也会被删除，因此除了附加条目之外，我还希望删除一些。

它应该模拟实时对话。

4

2 回答 2

2

您可以使用简单的长轮询技术来更新您的聊天。

例如：

//Updates the chat
function updateChat() {
    if(! instance){
        instance = true;
        $.ajax({
            type: "POST",
            url: "process.php",
            data: {function: 'update', state: state, file: file},
            dataType: "json",
            success: function(data) {
                if(data.text){
                    for (var i = 0; i < data.text.length; i++) {
                        $('#chat-area').append($("

                        "+ data.text[i] +"

                        "));
                    }   
                }
                document.getElementById('chat-area').scrollTop = document.getElementById('chat-area').scrollHeight;
                instance = false;
                state = data.state;
            },
            complete: function(){
               setTimeout(
                    updateChat, /* Request next message */
                    10000 /* ..after 10 seconds */
                );                
            },
            error: function(XMLHttpRequest, textStatus, errorThrown){
                //display you error message               
            },
            timeout: 10000 //Timeout is necessary to prevent chaining of unsuccessful ajax request    
        });
    }
}
于 2013-07-28T14:17:11.100 回答
0

您可以使用socket.io库来实现服务器到客户端的通知和/或双向实时通信。

于 2013-07-28T14:52:56.757 回答