首页 php教程 PHP源码 匿名聊天室

匿名聊天室

Aug 10, 2016 am 08:49 AM

跳至 [1] [2] [3] [4] [全屏预览]
<html>
    <head>
        <title>聊天室</title>
        <meta charset="utf-8"/>
        <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
        <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
        <link href="./css/style.css" rel="stylesheet"/>
        <script>
            var maxid = 0;
            function showmessage() {
                //创建ajax对象
                var xhr = new XMLHttpRequest();
                //监听
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        eval("var info=" + xhr.responseText);
                        var text = "";
                        for (var i = 0; i < info.length; i++)
                        {
                            text += "<div class='alert alert-success'>" +
                                    "<span class='name'>" + info[i].send + ":</span>" +
                                    "<span class='message'>" + info[i].content + "</span>" +
                                    "<span>(" + info[i].time + ")</span>" +
                                    "</div>";
                            maxid = info[i].id;
                        }

                        var old = document.getElementById("msg").innerHTML;
                        document.getElementById("msg").innerHTML = old + text;
                        document.getElementById("msg").scrollTop = document.getElementById("msg").scrollHeight;
                    }
                };
                //初始化
                xhr.open("get", "./action.php?maxid=" + maxid);
                //发送
                xhr.send();
            }

            $(document).ready(
                    function ()
                    {
                        showmessage()
                        self.setInterval("showmessage()", 2000);
                    }
            );
            function send() {
                var postData ="content="+document.getElementById('content').value;
                var xhr = new XMLHttpRequest();
                xhr.open("POST", "./add.php", true);
                //一定要写头信息不然服务器接收不到
                xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                xhr.onreadystatechange = function () {
                    var XMLHttpReq = xhr;
                    if (XMLHttpReq.readyState == 4) {
                        if (XMLHttpReq.status == 200) {
                           document.getElementById('content').value="";
                        }
                    }
                };
                xhr.send(postData);
            }
        </script>
    </head>
    <body>

        <div class="panel panel-default" id="main">
            <!--聊天室名字-->    
            <div class="panel-heading">
                <h3 class="panel-title">
                    匿名者聊天室
                </h3>
            </div>
            <!--聊天室名字-->
            <!--聊天室消息框-->
            <div class="panel-body ">
                <div class="well no-bottom ">
                    <!--                   消息框样式-->
                    <!--
                    <div class="alert alert-success">成功!很好地完成了提交。</div>
                    <div class="alert alert-info">信息!请注意这个信息。</div>
                    <div class="alert alert-warning">警告!请不要提交。</div>
                    <div class="alert alert-danger">错误!请进行一些更改。</div>
                    -->
                    <div id="msg" class="showmessage">
                    </div>
                    <!--聊天室消息框-->
                    <div class="well" >
                        <form role="form">
                            <div class="form-group">
                                <label for="name">发送消息</label>
                                <textarea class="form-control" id="content" name="content"
                                          style="resize: none;font-family: Microsoft YaHei;" rows="3" >
                                </textarea>
                            </div>
                            <div style="text-align: right">
                                <button type="button" class="btn btn-primary" onclick="send()">
                                    <span class="glyphicon glyphicon-envelope"></span>
                                    发送
                                </button>
                            </div>
                        </form>
                    </div>
                    <!--聊天室发送框-->
                </div>
            </div>
        </div>
    </body>
</html>
登录后复制

2. [文件] action.php ~ 367B 下载(0) 跳至 [1] [2] [3] [4] [全屏预览]

<?php

$link = mysqli_connect('localhost', 'root', '123', 'test');
mysqli_query($link, 'set names utf8');
$info=  array();
header("Content-type: text/html; charset=utf-8");
$id=$_GET['maxid'];
$data = mysqli_query($link, "select * from talk where id>$id");
while ($array = mysqli_fetch_assoc($data)) {
    $info[] = $array;
};

 echo json_encode($info);
登录后复制

3. [文件] chat.sql ~ 424B 下载(0) 跳至 [1] [2] [3] [4] [全屏预览]

DROP TABLE IF EXISTS `talk`;
CREATE TABLE `talk` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 'id',
  `send` varchar(10) CHARACTER SET utf8 DEFAULT NULL COMMENT '发送者昵称',
  `ip` varchar(12) CHARACTER SET utf8 DEFAULT NULL,
  `content` varchar(500) CHARACTER SET utf8 DEFAULT NULL,
  `time` varchar(50) DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=52 DEFAULT CHARSET=utf8;
登录后复制

4. [文件] add.php ~ 459B 下载(0) 跳至 [1] [2] [3] [4] [全屏预览]

<?php

/**
 * @功能 将表单插入数据库
 */
$content=$_POST['content'];
print_r($_POST);
$time=  date("Y-m-d H:i:s", time(0));
$link = mysqli_connect('localhost', 'root', '123', 'test');
mysqli_query($link, 'set names utf8');
$ip = $_SERVER["REMOTE_ADDR"];
$sql="INSERT INTO talk VALUES(NULL,'匿名者','$ip','$content','$time')";
$data = mysqli_query($link,$sql);
echo "$content";
if($data)
    echo "1";
    else
        echo "0";
登录后复制
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

<🎜>:泡泡胶模拟器无穷大 - 如何获取和使用皇家钥匙
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系统,解释
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆树的耳语 - 如何解锁抓钩
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1676
14
CakePHP 教程
1429
52
Laravel 教程
1333
25
PHP教程
1278
29
C# 教程
1257
24