HTML编辑器
终于有时间静下来总结一下最近的工作。
第一个就是html编辑器:
首先是编辑器的选择,之前用的是ewebeditor,功能很强大,出于粘贴word内容得安装插件的原因,暂时放弃。
ewebeditor的配置也很方便,代码如下:
<input name="form.summary" type="hidden" id="summary" value="<c:out value='${form.summary}'/>" />
<%--<iframe id="eWebEditor" src="editor/standard/ewebeditor.htm?id=content&style=coolblue" frameborder="0" scrolling="No" width="90%" height="500"></iframe>--%>
<IFRAME ID="eWebEditor1" SRC="editor/ewebeditor/ewebeditor.htm?id=summary&style=standard650" FRAMEBORDER="0" SCROLLING="no" WIDTH="99%" HEIGHT="500"></IFRAME></td>
默认选择office2003皮肤,因此改默认字体大小可以修改相应的皮肤。
之后选择了kindeditor,功能也足够用。配置如下:
引入包:
<script type="text/javascript" charset="utf-8" src="${ctxPath }/admin/kindeditor/kindeditor.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctxPath }/admin/kindeditor/lang/zh_CN.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctxPath }/admin/kindeditor/plugins/code/prettify.js"></script>
<textarea name="form.summary" id="summary" cols="100" rows="15" style="width:700px;height:350px;"></textarea>
js:
var editor;
KindEditor.options.cssData = 'body { font-size: 14px }';
KindEditor.ready(function(K) {
editor = K.create('#summary', {
cssPath : '${ctxPath}/ydhlw/admin/kindeditor/plugins/code/prettify.css',
uploadJson : '${ctxPath}/admin/kindeditor/jsp/upload_json.jsp',
fileManagerJson : '${ctxPath}/admin/kindeditor/jsp/file_manager_json.jsp',
allowFileManager : true,
//afterCreate : function() {
// var self = this;
// self.sync();
//}
});
prettyPrint();
});
save之前需要将数据同步到textarea里:editor.sync();
之后遇到了这样一个问题:
文本存到数据库,我在后台要取出展现到html编辑器当中,因此考虑到将文本的/n都换成<br />。
问题来了,我编辑文本保存,存到数据库之后,再取出,那么文本的/n又转换成了<br />,这样br的数量就成了原来的两倍。
采用的较简单的解决方式:用一个字段来保存内容值的状态,是第一次取出还是已编辑,如果是已编辑就不在转换/n。
HTML编辑器的更多相关文章
- NiceMark——我的Markdown编辑器
NiceMark--我的Markdown编辑器 闲来无事,写了一个Markdown编辑器.基于electron,完全采用Web前段技术(Html,css,JavaScript)实现.代码已托管在Git ...
- 关于Unity3D自定义编辑器的学习
被人物编辑器折腾了一个月,最终还是交了点成品上去(还要很多优化都还么做). 刚接手这项工作时觉得没概念,没想法,不知道.后来就去看<<Unity5.X从入门到精通>>中有关于 ...
- 在ASP.NET Core中使用百度在线编辑器UEditor
在ASP.NET Core中使用百度在线编辑器UEditor 0x00 起因 最近需要一个在线编辑器,之前听人说过百度的UEditor不错,去官网下了一个.不过服务端只有ASP.NET版的,如果是为了 ...
- 07.LoT.UI 前后台通用框架分解系列之——轻巧的文本编辑器
LoT.UI汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui 上次说的是强大的百度编辑器 http://www.cnblogs.com/d ...
- 富文本编辑器Simditor的简易使用
最近打算自己做一个博客系统,并不打算使用帝国cms或者wordpress之类的做后台管理!自己处于学习阶段也就想把从前台到后台一起谢了.好了,废话不多说了,先来看看富文本编辑器SimDitor,这里是 ...
- 玩转Vim 编辑器
一:VIM快速入门 1.vim模式介绍 以下介绍内容来自维基百科Vim 从vi演生出来的Vim具有多种模式,这种独特的设计容易使初学者产生混淆.几乎所有的编辑器都会有插入和执行命令两种模式,并且大多数 ...
- 个人网站对xss跨站脚本攻击(重点是富文本编辑器情况)和sql注入攻击的防范
昨天本博客受到了xss跨站脚本注入攻击,3分钟攻陷--其实攻击者进攻的手法很简单,没啥技术含量.只能感叹自己之前竟然完全没防范. 这是数据库里留下的一些记录.最后那人弄了一个无限循环弹出框的脚本,估计 ...
- [BootStrap] 富编辑器,基于wysihtml5
在我的周围,已经有很多人在使用BootStrap,但对于任何一个带留言.评论.提问.文章编辑功的网站,编辑器永远是重中之重,显然,早期的编辑器完全没考虑过BootStrap的出现,或皮肤跟网站不匹配, ...
- wordpress优化之结合prism.js为编辑器自定义按钮转化代码
原文链接 http://ymblog.net/2016/07/24/wordpress-prism/ 继昨天花了一天一夜的时间匆匆写了主题Jiameil3.0之后,心中一直在想着优化加速,体验更好,插 ...
- 关于SMARTFORMS文本编辑器出错
最近在做ISH的一个打印功能,SMARTFORM的需求本身很简单,但做起来则一波三折. 使用环境是这样的:Windows 7 64bit + SAP GUI 740 Patch 5 + MS Offi ...
随机推荐
- 编写我的第一个CGI代码——python学习
在编程学习网站学习Python语言,学习到cgi编程章节遇到了一些小问题,课程介绍的为linux环境的Apache配置方法,具体如下: [linux环境配置方法:] 在进行CGI编程前,确保您的Web ...
- zookeeper 应用
一,启动一个zk客户端 zookeeper/bin/zkCli.sh ls / 查看根目录下所有节点 create /znode data 创建节点znode,并添加数据内容为data ls /z ...
- 并列统计CASE WHEN
select sum(case when depart = 'Physical' then 1 else 0 end) PhyTotal, sum(case when depart = 'Chemis ...
- 网站过滤器Filter
实际上,Filter与Servlet及其相似,区别只是FIlter的doFilter()方法里多了一个FilterChain的参数,通过该参数可以控制是否放行用户的请求.网站有了过滤器十分的方便,可以 ...
- js制作简单的计算器
学着做了一个简单的计算器!记录记录!哈哈 <!DOCTYPE html> <html> <head> <title>简单的计算器</title&g ...
- Intel Code Challenge Final Round (Div. 1 + Div. 2, Combined) C. Ray Tracing
我不告诉你这个链接是什么 分析:模拟可以过,但是好烦啊..不会写.还有一个扩展欧几里得的方法,见下: 假设光线没有反射,而是对应的感应器镜面对称了一下的话 左下角红色的地方是原始的的方格,剩下的三个格 ...
- tab切换-淘宝案例
案例: html: <body> <div class="wrap" id="wrap"> <div class="no ...
- Angular自定义指令directive:scope属性
在AngularJS中,除了内置指令如ng-click等,我们还可以自定义指令.自定义指令,是为了扩展DOM元素的功能.代码中,通过指定directive中的restrict属性,来决定这个指令是作为 ...
- 自己不懂的SQL语句用法
left join:是SQL语言中的查询类型,即连接查询.它的全称为左外连接,是外连接的一种. 连接通常可以在select语句的from子句或where子句中建立,其语法格式为: select c ...
- redis集群报错
写入redis集群报错:(error) MOVED 6918 解决方法:redis-cli -c -p 7001 -h 10.0.0.104