h5聊天页面 jquery_h5聊天室web端(仿微博、微信)|h5仿微信网页端|仿微信界面弹窗...
/*--- 用户设置.Start ---*/
//联系人/群聊切换
$("body").on("click", ".wc__addChat-tab li", function() {var idx = $(this).index();
$(this).addClass("on").siblings().removeClass("on");
$(this).parents(".wc__popupTmpl").find(".J__swtChatUser").hide();
$(this).parents(".wc__popupTmpl").find(".J__swtChatUser").eq(idx).show();//清除筛选
$(".wc__addChatMixList .item").removeClass("selected");
});//1、新建聊天
$("body").on("click", ".J__addChat", function(){
$(".wc__addChat-tab").show();var chatidx =wcPop({
skin:'ios',
title:'
新建聊天
',
content: $("#J__popupTmpl-addChat").html(),
style:'background-color: #f3f3f3; max-width: 640px; width:auto;',
btns: [
{
text:'确定',
style:'background:#12b7f5;color:#fff;font-size:14px;',
onTap() {
wcPop.close(chatidx);
}
}
]
});
});//勾选联系人选项
$("body").on("click", ".wc__addChatMixList .item", function() {if($(this).hasClass("qun")){
$(this).addClass("selected").siblings().removeClass("selected");
}else{
$(this).toggleClass("selected");
}
});//2、设置聊天
$("body").on("click", ".J__setChat", function(e){var that = $(this), contextTpl, menuNode = $("
contextTpl= "
";if (!$(".wc__contextmenu").length) {
$("body").append(menuNode.html(contextTpl));
posFix();
}else{
$(".wc__contextmenu").hide().html(contextTpl).fadeIn(250);
posFix();
}functionposFix() {
$(".wc__contextmenu").css({
position:"absolute",
left: e.pageX,
top: e.pageY
});
}
});//群公告
$("#J__groupAnnouncement").on("click", function(){var announcementIdx =wcPop({
skin:'android',
title:'群公告',
content:'
jcFlow 更新于 08-10 10:26
进群的小伙伴注意啦,修改群名,格式统一为部门加英文名(技术部-Jackson),部门有英文简称的用英名,无则用中文拼音首字母,如JS-Henory……注意大小写!
',
btns: [
{
text:'关闭',
style:'color: #12b7f9;',
onTap() {
wcPop.close(announcementIdx);
}
}
]
});
});//屏蔽消息
$("#J__shieldMsg").on("click", function() {var shieldIdx =wcPop({
skin:'android',
title:'提示',
content:'确定要屏蔽该群聊消息嚒,您将收不到群聊发来的消息!',
btns: [
{
text:'取消',
onTap() {
wcPop.close(shieldIdx);
}
},
{
text:'确定',
style:'color: #12b7f9;',
onTap() {
wcPop({ content:'消息屏蔽成功!', time: 2});
}
}
]
});
});//解除屏蔽
$(".J__unlockerMsg").on("click", function(){var unshieldIdx =wcPop({
skin:'ios',
content:'
已解除屏蔽!
您现在可以接收到对方发来的消息。
',
time:2,
btns: [
{
text:'知道了',
style:'color: #12b7f9;',
onTap() {
wcPop.close(unshieldIdx);
}
}
]
});
});//群聊信息
$("#J__groupMemberInfo").on("click", function(){var chatMemidx =wcPop({
skin:'ios',
title:'
群聊信息(124)
',
content: $("#J__popupTmpl-groupMemInfo").html(),
style:'background-color: #f3f3f3; max-width: 640px; width:auto;'});
});//删除退群
$("body").on("click", "#J__leaveOutQun", function() {var leaveOut =wcPop({
id:'wc__LeaveOutQun',
skin:'android',
content:'删除并退出群聊后,将不再接收此群聊的信息?',
btns: [
{
text:'取消',
onTap() {
wcPop.close(leaveOut);
}
},
{
text:'确定',
style:'color:#e64240',
onTap() {
wcPop.closeAll();
wcPop({id:'wcTips', content: '已退出该群聊!', time: 2});
}
}
]
});
});/*--- 用户设置.End ---*/
h5聊天页面 jquery_h5聊天室web端(仿微博、微信)|h5仿微信网页端|仿微信界面弹窗...相关推荐
- H5分享页面(1)——web端二次分享配置内容
在H5分享页面中,如果用户进行了二次分享,需要进行一些配置才能进行使用,如微信二次分享就必须调用微信的JS-SDK来完成.下面对分享配置代码进行了封装: 存放路径:public/resources/j ...
- 图书管理系统(微信、后台、网页端)总结
Web课程技术总结--个人项目 网页前端 基本框架 vue 1.值存储问题 需要变更属性时(update),需要先获取属性(get),这里在返回时需要在服务端将值设为null,在更新时需要采用sele ...
- 微信调用jssdk在网页端实现调用扫一扫,java+jsp
这篇文章以讲解的方式,帮助大家来理解微信官方的文档,同时给出调用扫一扫的例子. 微信官方技术文档jssdk:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e04 ...
- 如何快速开发H5列表页面
小编最近在做一个任务:要求实现一个在微信公众号里面的H5列表页面.拿到这个任务我们首先要进行需求分析,由于是在微信公众号也就是手机里面的H5列表,所以就不可能像PC上的列表页面那样进行分页处理,应该按 ...
- python微信群聊机器人_Python + itchat 实现微信机器人聊天(支持自动回复指定群聊)...
Python + itchat 实现微信机器人聊天(支持自动回复指定群聊) 发布时间:2018-10-25 22:38, 浏览次数:600 , 标签: Python itchat <>Py ...
- 基于Springboot的聊天室Web系统设计
基于Springboot的聊天室Web系统设计 一.新建项目与配置 二.编码 三.运行结果 参考 一.新建项目与配置 1.新建spring项目 2.在pom.xml中添加以下内容: <depen ...
- web实现置顶、置底功能、聊天页面、锚点、滚动条、vue、scrollTop、scrollIntoView、scrollHeight
目录 前言 1.代码实现 3.scrollTop实现置顶置底(方式一) 4.scrollIntoView实现置顶置底(方式二) 5.总结 前言 在项目中遇到聊天功能,功能涉及置顶和置底知识,由此记录一 ...
- java制作h5视频聊天_JAVA实现大华摄像头WEB方式实时显示视频,H5界面展示方式思路。...
JAVA实现大华摄像头WEB方式实时显示视频,H5界面展示方式思路. 2018-09-17 问题:大华IPC枪型摄像头需要在WEB中显示实时监控视频,官方提供的SDK只有C#的桌面程序访问方式. 解决 ...
- openfire运行环境部署+jwchat网页端通信聊天+插件的基础知识+webchat环境配置和下载地址
研究Openfire快一个月的时间了,最初的项目要求是利用Openfire作为服务器端,在网页端注册或输入登录信息进行类似QQ的聊天.后来需要在网页端加入客服系统实现匿名登录和实名登录功能,实现N个客 ...
- Vue3+ElementPlus网页端聊天|vue3.0仿微信/QQ界面实例
vue3-webchat 基于vue3.0.5开发的仿微信|QQ界面桌面端聊天实例. 运用vue3.x全家桶技术+element-plus+v3layer+v3scroll搭建的仿微信/QQ界面网页聊 ...
最新文章
- 谈一谈UNet图像分割
- python应用于期货_Python期货量化交易基础教程(17)
- VHDL汽车尾灯控制器的设计
- html模板 循环里if,django模板里循环变量table里想要两个一行如何控制
- 前端学习(833):操作元素小结
- vue TypeError: Cannot read property ‘upgrade‘ of undefined
- 二年级小学生四则运算30道题目编写
- 使用维护Relationship
- java基础知识---IO常用基础操作(二)
- 【Zend Studio】10.6.0版本设置默认编码为UTF-8
- Item 16: Avoid Creating Unnecessary Objects(Effective C#)
- c3p0连接池配置连接不上mysql_数据库连接池之c3p0的配置 + 问题解决方案
- 类继承和接口继承的差别
- VB6.0调用WebService
- debian编译内核2.6.16-1
- Modem相关知识__2019.12.03
- 找出阿里云RDS数据库的IP地址
- 自然语言处理面试基础
- Unity3D 协程
- python写出雷霆战机_利用Python自制雷霆战机小游戏,娱乐编程,快乐学习!
热门文章
- adb关闭手机系统自动更新
- 京东商品详情查询接口V1新版接口
- Lua 程序设计——Lua 教程01
- neo4j修改节点(包括属性,关系)
- 已知 XYZ+YZZ=532,其中,X、Y、Z 为数字,编程求出 X、Y 和 Z 的值。
- 傻妞旧版合集新版订阅
- 《现代操作系统》阅读笔记
- Linux第7章Gdk及Cairo基础,GNOME 平台的2D图形编程(GTK,GDK,Cairo...) 简介 [转]...
- 字体大小fontsize中的pt、px、em
- 如何解决“App开发者需要更新此App以在此iOS版本上正常工作”