富文本编辑器NicEdit的使用

调用nicEdit.js和一张nicEdit所需要的icon图

<script type="text/javascript" src="/js/nicEdit.js"></script>
<script type="text/javascript">bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });
</script>

html创建一个textarea

<html>
<div class='zl-item lw-con-mes-other'><div class='tex-box'><h3 class='zl-title'>具体计划书</h3><textarea name="prospectus" style="width: 100%; height: 150px;" id="prospectus" form="addSyzrsq"></textarea></div></div>
</html>

获取内容包含标签。

通过id获取textarea值

如果要一次性提交要后台，可先通过id获取，然后将其放入隐藏域中传递

通过id获取文本值

var c = nicEditors.findEditor('prospectus').getContent()

该编辑器可以保存样式等内容，样式可自己随意调；所以需要进行转义解决，如果不转义会出现乱码情况；

转义前：

转义后：

<h1 style="text-align: center;"><span style="background-color: rgb(153, 153, 153);">654654654654</span></h1>

转义代码网上好多，给大家推荐一个：https://www.cnblogs.com/yangzhilong/p/5667165.html

富文本编辑器NicEdit的使用相关推荐

【转】推荐两款富文本编辑器：NicEdit和Kindeditor
做过Web开发的朋友相信都使用过富文本编辑器,比较出名的CuteEditor和CKEditor很多人应该已经使用过,在功能强大的同时需要加载的东西也变得很多.下面要推荐的两款富文本编辑器都是使用JS编 ...
N个富文本编辑器/基于Web的HTML编辑器
转自:http://www.cnblogs.com/lingyuan/archive/2010/11/15/1877447.html 基于WEB的HTML 编辑器,WYSIWYG所见即所得的编辑器,或 ...
asp.net中两款文本编辑器NicEdit和Kindeditor
分类: C#/ASP.Net 2012-10-09 22:35 665人阅读评论(0) 收藏举报文本编辑asp.nettextboxserveraspsafari 目录(?)[+] 做过Web开 ...
Html富文本编辑器
本文推荐两款简单的富文本编辑器[KindEditor,NicEdit]用于获得所见即所得的编辑效果,本文仅供学习分享使用,如有不足之处,还请指正. 概述这两款编辑器都是采用JavaScript编写, ...
带格式粘贴至html富文本,防止复制/粘贴将网页样式复制到富文本编辑器
我想了两天现在几个JavaScript轻量级富文本编辑器(rte),如nicEdit,mooEditable,MooRTE(最后两个被认为是因为他们使用了我用于这个项目的mootools框架).防止复 ...
web富文本编辑器的选择のxheditor
最近在研究web富文本编辑器,处理知道的 1.老牌fckeditor 网址:http://ckeditor.com/ 2.百度退出的ueditor 网址:http://uedito ...
网页富文本编辑器推荐
如题. 进行网页开发的时候,textarea并不能够满足我们的所有需要.如果你正在寻找合适的富文本编辑插件,我这里可以给大家推荐几款: 百度Ueditor: 这个editor是我目前正在使用的.功能强 ...
在线富文本编辑器-基于Web的HTML编辑器大全（一）
基于WEB的HTML 编辑器,WYSIWYG所见即所得的编辑器,或是一个富文本的编辑器,是我们在开发WEB应用和内容管理系统时接收用户输入时必需要考虑的问题.下面是网上牛人收集的一些开源的WEB在线的 ...
.net下的富文本编辑器FCKeditor的配置方法（图）原创
.net下的富文本编辑器FCKeditor的配置方法(图)原创 FCKeditor是一款开源的富文本编辑器,几乎支持所有流行的Web开发语言,版本稳定,用户多,可配置性好. 以前做Java和php的时 ...
jeecg富文本编辑器增加字体(仿宋)
jeecg富文本编辑器增加字体(仿宋) 温馨提示:jeecg 提供了 uedit 富文本的实现,如下针对的是 uedit 增加仿宋字体示例. 主要修改三个文件:plug-in\ueditor\uedi ...

富文本编辑器NicEdit的使用

富文本编辑器NicEdit的使用相关推荐

最新文章

热门文章