跳至
[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
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
Windows 11 KB5054979中的新功能以及如何解決更新問題
3 週前ByDDD
如何修復KB5055523無法在Windows 11中安裝？
3 週前ByDDD
Inzoi：如何申請學校和大學
4 週前ByDDD
如何修復KB5055518無法在Windows 10中安裝？
3 週前ByDDD
在哪裡可以找到Atomfall中的站點辦公室鑰匙
4 週前ByDDD
熱工具
VSCode Windows 64位元 下載
微軟推出的免費、功能強大的一款IDE編輯器
DVWA
Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序，非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具，幫助Web開發人員更好地理解保護網路應用程式的過程，並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞，難度各不相同。請注意，該軟體中
Atom編輯器mac版下載
最受歡迎的的開源編輯器
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3 英文版
推薦：為Win版本，支援程式碼提示！
