Kindeditor在线文本编辑器如何过滤HTML

 更新时间:2016年04月14日 10:13:54   作者:国盛工作室  
KindEditor使用JavaScript编写,可以无缝的与Java、.NET、PHP、ASP等程序接合。本文给大家介绍Kindeditor在线文本编辑器如何过滤HTML,需要的朋友参考下吧

  KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所见即所得编辑效果,兼容IE、Firefox、Chrome、Safari、Opera等主流浏览器。 KindEditor使用JavaScript编写,可以无缝的与Java、.NET、PHP、ASP等程序接合。这个是官网上的介绍。

主页:http://www.kindsoft.net/index.php

下载:http://www.kindsoft.net/down.php

示例:http://www.kindsoft.net/demo.php

在使用kindeditor文本编辑器时遇到的问题,客户直接从Excel里粘贴文本内容到文本编辑器中(能不能再懒一些),然后不调整粘贴内容直接就保存(你敢不敢再懒一些)!对于这种很无语的行径,我只能对他大吼一声,我做一个标签过滤吧,这样你粘贴就不会出现问题了(怂?谁惹得起客户)。

过滤方法也简单:

KindEditor.ready(function (K) {
editor = K.create('textarea[name="content"]', {
filterMode: true,//是否开启过滤模式
});
}); 

默认filterMode是关闭状态,首先把filterMode设置为true,然后增加htmlTags,指定要保留的HTML标记和属性。哈希数组的key为HTML标签名,value为HTML属性数组,"."开始的属性表示style属性。数据类型:Object

KindEditor.ready(function (K) {
editor = K.create('textarea[name="content"]', {
filterMode: true,//是否开启过滤模式
htmlTags : {
font : ['id', 'class', 'color', 'size', 'face', '.background-color'],
div : [
'id', 'class', 'align', '.border', '.margin', '.padding', '.text-align', '.color',
'.background-color', '.font-size', '.font-family', '.font-weight', '.background',
'.font-style', '.text-decoration', '.vertical-align', '.margin-left'
],
a : ['id', 'class', 'href', 'target', 'name'],
embed : ['id', 'class', 'src', 'width', 'height', 'type', 'loop', 'autostart', 'quality', '.width', '.height', 'align', 'allowscriptaccess'],
img : ['id', 'class', 'src', 'width', 'height', 'border', 'alt', 'title', 'align', '.width', '.height', '.border'],
'p,ol,ul,li,blockquote,h1,h2,h3,h4,h5,h6' : [
'id', 'class', 'align', '.text-align', '.color', '.background-color', '.font-size', '.font-family', '.background',
'.font-weight', '.font-style', '.text-decoration', '.vertical-align', '.text-indent', '.margin-left'
],
pre : ['id', 'class'],
hr : ['id', 'class', '.page-break-after'],
'br,tbody,tr,strong,b,sub,sup,em,i,u,strike,s,del' : ['id', 'class'],
iframe : ['id', 'class', 'src', 'frameborder', 'width', 'height', '.width', '.height']
}
});
});

以上所述是小编给大家介绍的Kindeditor在线文本编辑器如何过滤HTML,希望对大家有所帮助!

相关文章

  • js中事件对象和事件委托的介绍

    js中事件对象和事件委托的介绍

    今天小编就为大家分享一篇关于js中事件对象和事件委托的介绍,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-01-01
  • 浅析js 文字滚动效果

    浅析js 文字滚动效果

    文字滚动显示,是网页企业公告,文字链广告常用的一种效果,说不定在什么时候你就能看到它。
    2010-05-05
  • 详解简单易懂的 ES6 Iterators 指南和示例

    详解简单易懂的 ES6 Iterators 指南和示例

    这篇文章主要介绍了详解简单易懂的 ES6 Iterators 指南和示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-09-09
  • JS实现单例模式的N种方案

    JS实现单例模式的N种方案

    JS实现单例模式的多种方案 ,本文稍加总结,列出了6种方式与大家分享,大体上将内容分为了ES5(Function)与ES6(Class)实现两种部分,对js单例模式相关知识感兴趣的朋友跟随小编一起看看吧
    2022-09-09
  • 读Javascript高性能编程重点笔记

    读Javascript高性能编程重点笔记

    这篇文章主要介绍了读Javascript高性能编程重点笔记,需要的朋友可以参考下
    2016-12-12
  • 4个值得收藏的Javascript技巧

    4个值得收藏的Javascript技巧

    这篇文章主要介绍了4个值得收藏的Javascript技巧,文章首先通过变量转字符串展开主题详情,需要的小伙伴可以参考一下
    2022-07-07
  • JavaScript DOM节点操作方法总结

    JavaScript DOM节点操作方法总结

    下面小编就为大家带来一篇JavaScript DOM节点操作方法总结。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • 完美解决spring websocket自动断开连接再创建引发的问题

    完美解决spring websocket自动断开连接再创建引发的问题

    下面小编就为大家带来一篇完美解决spring websocket自动断开连接再创建引发的问题。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-03-03
  • JS实现读取Excel文件内容并生成二维码

    JS实现读取Excel文件内容并生成二维码

    这篇文章主要为大家介绍了如何使用JavaScript实现读取Excel文件内容并生成二维码下载到本地,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下
    2022-04-04
  • 详解使用JS如何制作简单的ASCII图与单极图

    详解使用JS如何制作简单的ASCII图与单极图

    这篇文章主要给大家介绍了使用JS如何制作简单的ASCII图与单极图的相关资料,文中介绍的非常详细,并在文末给出了详细的示例代码,相信对大家具有一定的参考价值,需要的朋友们下面来一起看看吧。
    2017-03-03

最新评论