KindEditor 添加默认提示信息
2016-02-04 17:30
399 查看
Qt中用这个编辑框可以设置提示信息并且禁用跳转链接
var editor; var tipFlag = true; var placeholderText = ''; KindEditor.ready(function(K) { editor = K.create('textarea[name="detailContent"]', { cssData : 'body {font-family:Microsoft YaHei; font-size:12px;} img{ max-width:100%;}', fullscreenMode: true, useContextmenu: false, filterMode: false, afterCreate:function(){ //阻止点击链接默认跳转操作 var self = this; var doc = this.edit.doc; K(doc).click(function(e) { if (K(e.target).name === 'a') { e.preventDefault(); } }); //添加一个提示编辑区 var frame = this.edit; K('<textarea class="ph ke-edit-textarea" placeholder = "" style="width: 100%; padding:5px 5px 5px 7px; background-color:transparent; position: absolute;z-index: 10;top: 0;border: 0;overflow: auto;resize: none; font-size:12px;"></textarea>').appendTo(frame.iframe[0].contentDocument.firstChild); frame.iframe[0].contentDocument.firstChild.lastChild.style.height = "100%"; frame.iframe[0].contentDocument.firstChild.lastChild.placeholder = placeholderText; var _ua = navigator.userAgent.toLowerCase(); var _IE = _ua.indexOf('msie') > -1 && _ua.indexOf('opera') == -1; if(_IE) { //IE的事件穿透没做 }else{ //事件穿透 frame.iframe[0].contentDocument.firstChild.lastChild.style.pointerEvents = 'none'; } //监听输入事件 K(frame.doc)[0].oninput = function(e){ if(tipFlag && editor && editor.text() != '') { frame.iframe[0].contentDocument.firstChild.lastChild.style.display = "none"; tipFlag = false; } else{ if(editor && editor.text() == '' && !tipFlag) { frame.iframe[0].contentDocument.firstChild.lastChild.style.display = "block"; tipFlag = true; } } }; }, afterChange:function(){ if(editor) { var frame = this.edit; if(editor.text() != '' && tipFlag) { frame.iframe[0].contentDocument.firstChild.lastChild.style.display = "none"; tipFlag = false; }else if(editor.text() == ''&& !tipFlag) { frame.iframe[0].contentDocument.firstChild.lastChild.style.display = "block"; tipFlag = true; } frame.doc.body.focus(); } }, items : [ 'bold','italic','underline','fontname','fontsize','forecolor','hilitecolor','link','selectall','source'] }); editor.focus(); }); //设置提示信息,这个要在html加载完成以后调用 function setPlaceholderText(text){ var data = utf8to16(base64decode(text)).replace(/\s/gi," "); placeholderText = data; if(editor && editor.edit && editor.edit.iframe[0] && editor.edit.iframe[0].contentDocument && editor.edit.iframe[0].contentDocument.firstChild && editor.edit.iframe[0].contentDocument.firstChild.lastChild){ editor.edit.iframe[0].contentDocument.firstChild.lastChild.placeholder=''; editor.edit.iframe[0].contentDocument.firstChild.lastChild.placeholder = data; } editor.focus(); }
相关文章推荐
- Java序列化与反序列化
- Java集合类总结 (四)
- Spring学习4-面向切面(AOP)之schema配置方式
- excel
- C++实现查找二叉树中和为某一值的所有路径的示例
- 如何“任性”使用Android的drawText()
- 备份oracle并传输备份到windows服务器上
- 几种常见的跨域技术
- Spring学习4-面向切面(AOP)之Spring接口方式
- 网上图书商城项目学习笔记-037工具类之BaseServlet及统一中文编码
- 【Java Tutorial中文版 开篇综述】 Oracle(甲骨文)公司Java最新官方教程【译文】
- Python中的时间相关问题
- LeetCode 191 Number of 1 Bits
- 第十八章 并发登录人数控制——《跟我学Shiro》
- Spring学习3—控制反转(IOC)基于Annotation(注解)的依赖注入实现
- ios关于如何获取手机当前的ip
- 学习笔记------数据结构(C语言版)栈和递归 汉诺塔
- eclipse加速之禁用JS、jsp等文件的语法验证,eclipsejs
- SQL Server Export and Import 导出和导入工具 导入EXCEL居然限制为255列
- nyoj264国王的魔镜