php js在线聊天,js实现智能在线客服系统
摘要:看似简单,但自己做的时候总是记不住那些方法和属性,还是多记多练习
DOM实战:模拟智能在线客服系统
div:nth-child(1) {
width: 450px;
height: 650px;
background-color: lightskyblue;
margin: 30px auto;
color: #333;
box-shadow: 2px 2px 2px #808080;
}
h2 {
text-align: center;
margin-bottom: -10px;
}
div:nth-child(2) {
width: 400px;
height: 500px;
border: 4px double green;
background-color: #efefef;
margin: 20px auto 10px;
}
ul {
list-style-type: none;
line-height: 2em;
overflow: hidden;
padding: 15px;
}
table {
width: 90%;
height: 80px;
margin: 0px auto;
}
textarea {
border: none;
resize: none;
background-color: lightyellow;
}
button {
width: 60px;
height: 40px;
background-color: seagreen;
color: white;
border: none;
}
button:hover {
cursor: pointer;
background-color: orange;
}
在线客服
发送 |
//获取到页面中的相关元素
let btn = document.getElementsByTagName('button')[0];
let text = document.getElementsByName('text')[0];
let list = document.getElementsByTagName('ul')[0];
let sum = 0; //计数器
//添加点击事件,获取用户说的内容并发送到窗口
btn.onclick = function(){
//获取用户提交的内容
if (text.value.length === 0) {
alert('客官,是不是忘了想说什么了?');
return false;
}
let userComment = text.value; //将用户提交的内容获取并保存
text.value = '';
//创建一个li
let li = document.createElement('li');
//用户头像
// let userPic = '';
//将用户输入的信息添加到聊天窗口
li.innerHTML = userComment;
list.appendChild(li);
sum +=1;
//回复,设置定时器,2秒后自动回复
setTimeout(function(){
let info = [
'真烦人,有话快说,别耽误我学习',
'除了退款退货,什么都可以问',
'说的啥,本姑娘怎么听不明白呢?',
'在我觉得方便的时候再回复你',
'投诉我的人多了去了,哈哈哈。'
];
let temp = info[Math.floor(Math.random()*4)];
let reply = document.createElement('li');
// let kefuPic = '';
reply.innerHTML = '' + temp + '';
list.appendChild(reply);
sum += 1;
},1000);
//清空窗口并将计数器清零
if (sum > 10){
list.innerHTML = '';
sum = 0;
}
}
批改老师:欧阳批改时间:2019-03-18 09:12:31
老师总结:写的还不错。刚开始都记不住方法和属性。 就算写了10年代码,也不可能记住全部的方法和属于,只能记得常用的。继续加油。
php js在线聊天,js实现智能在线客服系统相关推荐
- ATEC倒计时24天|智能云客服系统帮助业务提升背后的秘密
小蚂蚁说: 考虑到加速回报定律,过去20年,科技对日常生活的改变可能比我们想象中的更丰富和立体. 只是,看不见,摸不着的技术是如何悄无声息地进行着这场革命?又是哪些技术完成了让"鸡毛蒜皮&q ...
- 京东智能情感客服挽救一名学生生命,“可信赖的AI”用温暖前行
允中 发自 凹非寺 量子位 编辑 | 公众号 QbitAI "一下吃完一整瓶还能活着吗?"近日,一位广东用户在京东上咨询智能情感客服时留下了这样的话. 随后,一场跨越千里的线上线下 ...
- 手把手快速搭建智能语音客服——保险问答实践
零基础快速搭建全流程智能语音客服系统--保险问答实践 1. 背景介绍 智能语音客服是智能客服的重要组成部分,在语音相关的人机交互场景中都有所应用,如智能外呼机器人,智能呼入机器人,虚拟人客服,数字员工 ...
- 在线客服系统源码开发实战总结:动态加载js文件实现粘贴一段js的sdk代码,直接引入插件效果...
常见的在线客服系统中,或者是统计代码中,粘贴一段js代码,就能引入某个插件的效果.这个是怎么实现的呢? 原理非常的简单: 对于不同的加载文件类型创建不同的节点,然后添加各自的属性,最后扔到head 标 ...
- 2022.8月更新在线客服系统源码外贸聊天通讯带翻译多语言接待支持网页APP
8月4号更新日志:更新谷歌翻译接口,更新发送语音功能,更新地图发送功能,优化前端接待页面UI. 8月22号更新日志:主要代码重整,防止被反Z中心错误判断DNS污染拦截. 原文章地址:http://pe ...
- 开源版-在线客服系统源码_网页聊天室源码_webim
2019独角兽企业重金招聘Python工程师标准>>> WoLive是一款在线客服系统源码,支持PC Web和移动端,只需嵌入一段js代码即可快速接入.购买后可私有化部署,WoLiv ...
- 最新在线客服系统php代码微信软件公众号小程序app二维码聊天网站源码
最新在线客服系统php代码微信软件公众号小程序app二维码聊天网站源码 管理界面 独家长期更新日志(欢迎反馈BUG) 1.添加手机端前后台声音提示 2.添加后台客户管理显示在线离线 3.添加清空当前对 ...
- 多商户机器人,自助注册在线客服系统,im即时通讯聊天
介绍: 自助注册,免费试用 - 加强客户体验,商机转化率提升50% - 提升在线客服效率,专注线上转化 多重技术保障 - 动态DNS持续重连 直至到达 - 全面的SLA保障体系,大数据集群部署 多渠道 ...
- php智能客服,智能在线客服系统
摘要: &在线客服系统 div:nth-child(1){ width: 460px; height: 660px; background-color: lightblue; margin: ...
最新文章
- vue.js循环for(列表渲染)详解
- python 函数、面向对象
- 从一个点云里面创建一个深度图
- hdu 1025 Constructing Roads In JGShining's Kingdom
- C#语言-NPOI.dll导入Excel功能的实现
- 关于马尔科夫随机场MRF的思考
- 【汇编语言】通用数据处理指令——算术运算类指令
- MATLAB/Simulink搭建电动汽车整车七自由度模型
- Windows系统备份方法解答
- php 3cschool,W3Cschool中的PHP测试题题目以及答案
- 【Autosar RTM】
- 2019年大学计算机基础题库,大学计算机基础考试题库(含答案)
- 用RunASDate解决SAS 9.4许可证过期的问题
- ios wallet开发_iOS Wallet 开发
- 运动快乐的来源-内啡肽
- 【异步电路碎碎念1】 —— 到底什么是异步电路
- 简单游戏Roll_A_Ball开发笔记
- 开发一款类似于搜索助推于生活的平民软件
- 【历史上的今天】11 月 13 日:万维网第一个网页诞生;Lisp 语言先驱出生;当当网上线
- Oracle 修改字符集(AL32UTF8 转换成UTF8字符集)