功能分析:百度编辑器内改编(加)https://ueditor.baidu.com/website/onlinedemo.html?qq-pf-to=pcqq.c2c
1.监听百度编辑器 判断操作系统的键盘输入值 @ 然后获取编辑器内容(延时获取)。
2.追加一个隐藏框,JSON数据(远程获取),实现QQ、微信群发功能@群发功能。
3.需要获取js获取光标原理,JS DOM对象 节点光标(结合文本功能开发)
4.选取文本的内容,制作php录入mysql时候 发送邮件功能和短信功能(php缓冲带功能或者php控制器,model抽选发送)
5.功能完成
详解第一步:
当前编辑器内默认的监听事件找个这个文件的这个地方,接下来我们要进行 键盘监控的操作:
监听编辑器的内置键盘值(单个操作,不使用组合键),组合键会带来不可避免的动态语言漏洞当我们监听到了这几个键值,这是要监听编辑器的文本是否存在@字符串,然后做好一些列的高操作,这里我使用原生JS DOM对象+window对象和部分JQ代码混写:
这里是当我监听到@键(英文状态)即可出现 基于最外层body的div人员 这个是当@出现时 利用编辑器的光标位置 + body的xy轴定位拿到的body层子div显示窗 这一部分是body的外层div 也是JSON获取的数据渲染人员显示ok完成上面几步操作,已经完成了@功能的百分之60,接下来要完成百分之20的操作,整体的百分之20操作视为一个js文件,外接入。所需要的技术是 DOM的键盘和鼠标的点击操作。都是采用监听的功能。
功能详解 以上截图就是整体的百分之20,那么我的功能已经完成百分之80,剩下的功能都由动态语言操作了。以下是我的功能展示(默认显示和全屏功能,对了 全屏功能自己根据 监听部分自己找到对应的全屏按钮 新建对应的window对象判断就可以了)好的,后面我可能会继续带入更多的百度编辑器中的奇葩的功能,已完成业务员中最简单的操作。同样的操作适合其它的WEB端编辑器开发。
网友评论