摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content=&q
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>实战聊天框信息</title>
<link rel="stylesheet" href="../common/css/admin.css">
</head>
<body>
<div>
<h2>在线客服</h2>
<div>
<ul>
在线客服
</ul>
</div>
<div>
<textarea name="text" id="text" cols="40" rows="5"></textarea>
<button name="send" type="button">发送</button>
</div>
</div>
<script>
var txt = document.getElementsByName('text').item(0);
var btn = document.getElementsByName('send').item(0);
var ul = document.getElementsByTagName('ul').item(0);
var num = 0;
document.onkeydown = function(event){
var e = event || window.event;
if(e && e.keyCode == 13){
chatword();
}
}
btn.onclick = chatword;
function chatword(){
if(txt.value.length == 0){
alert('输入内容为空');
return false;
}
console.log(txt.value);
var show = document.createElement('li');
show.innerHTML = '<p>' + txt.value + '</p>';
ul.appendChild(show);
txt.value = '';
num+=1;
setTimeout(function(){
var arr = ['hi!','谢谢','不好吧','有什么事吗','好的','知道了'];
var reply = document.createElement('li');
reply.innerHTML = '<p>' + arr[Math.round(Math.random()*7)] + '</p>';
ul.appendChild(reply);
num+=1;
},1200);
if(num>=11){
ul.innerHTML = '';
num = 0;
}
}
</script>
</body>
</html>通过事件触发来生成一个内容进行回复，达成简易的回复系统
批改老师：韦小宝批改时间：2019-01-02 15:57:03
老师总结：后期还可以来写一个匹配的那种回复系统，根据发送过来的消息中的关键字来进行回复！
