网页开发中文本编辑器UEditor的使用
2016-04-26 15:42
573 查看
首先看一下效果图:
首先我们需要来认识下UEditor,它是由百度web前端研发部开发所见即所得富文本web编辑器,并且是基于BSD协议的开源产品,允许自由使用和修改,开源就意味着可以自己来定制这个编辑器。
实现方法:
首先先下载UEditer,官方网址:http://ueditor.baidu.com/website/,根据自己需求下载相应的版本(其实里面都有demo实现调用编辑器)
下面就是一个简单的调用实例,只需要引入ueditor.config.js,ueditor.all.min.js,lang/zh-cn/zh-cn.js这三个文件即可,还需要其他功能的可以继续去挖掘
当把该编辑器放在一个表单中,提交后即可通过content来读取编辑器的内容。
在官方提供的demo中可以查看一下提供还有许多提供的方法:
比如:使用editor.getContent()方法可以获得编辑器的内容
使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容
需要的话可以参考官方文档
bbg
首先我们需要来认识下UEditor,它是由百度web前端研发部开发所见即所得富文本web编辑器,并且是基于BSD协议的开源产品,允许自由使用和修改,开源就意味着可以自己来定制这个编辑器。
实现方法:
首先先下载UEditer,官方网址:http://ueditor.baidu.com/website/,根据自己需求下载相应的版本(其实里面都有demo实现调用编辑器)
下面就是一个简单的调用实例,只需要引入ueditor.config.js,ueditor.all.min.js,lang/zh-cn/zh-cn.js这三个文件即可,还需要其他功能的可以继续去挖掘
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script type="text/javascript" charset="utf-8" src="UEditor/ueditor.config.js"></script> <script type="text/javascript" charset="utf-8" src="UEditor/ueditor.all.min.js"> </script> <!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败--> <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文--> <script type="text/javascript" charset="utf-8" src="UEditor/lang/zh-cn/zh-cn.js"></script> </head> <body> <script id="container" name="content" type="text/plain">这里就是编辑器的正文</script> <!-- 实例化编辑器 --> <script type="text/javascript"> var ue = UE.getEditor('container'); </script> </body> </html>
当把该编辑器放在一个表单中,提交后即可通过content来读取编辑器的内容。
在官方提供的demo中可以查看一下提供还有许多提供的方法:
比如:使用editor.getContent()方法可以获得编辑器的内容
使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容
需要的话可以参考官方文档
bbg
相关文章推荐
- 当UITextField有内容时,button才能被点击
- javax.jms.JMSException: Failed to build body from content. Serializable class not available to broke
- RequireJS 配置理解
- RequireJS 配置理解
- Android 4.4 Kitkat Phone工作流程浅析(二)__UI结构分析
- 使用duilib开发半透明异形窗体程序(补充)
- 使用guestmount挂载KVM虚拟机的磁盘
- 算法Sedgewick第四版-第1章基础-2.3 Quicksort-001快速排序
- UE3名称结构(Name)
- 出现An internal error occurred during: “Building workspace”.的解决方法
- android studio新建project的时候connect refused:connect或者卡在building project...或Refreshing
- iOS开发UI篇—UIWindow简单介绍
- RequireJS 加载 js 执行顺序
- 蓝牙技术BlueTooth
- Andrid Studio常用开发插件
- 【Vue】 -(7) 事件和方法
- UITabbarController的UITabbarItem(例:"我的")点击时,判断是否登录
- IOS7以上用UINavigationController 导致tableview下移解决方法
- 解决Maven更新后错误Dynamic Web Module 3.0 requires Java 1.6 or newer
- ValueAnimator的介绍与使用