一不小心接触到Simditor,瞬间被它优美极简的界面所吸引。Simditor是Tower开源的所见即所得的在线富文本编辑器。

Simditor的理念是保持简单,避免过度的功能,每个特性都追求极致的用户体验。

用法

1、在你的html页面中引用例如以下文件

<link media="all" rel="stylesheet" type="text/css" href="simditor/styles/font-awesome.css" />
<link media="all" rel="stylesheet" type="text/css" href="simditor/styles/simditor.css" /> <script type="text/javascript" src="simditor/scripts/jquery.min.js"></script>
<script type="text/javascript" src="simditor/scripts/module.js"></script>
<script type="text/javascript" src="simditor/scripts/uploader.js"></script>
<script type="text/javascript" src="simditor/scripts/simditor.js"></script>

2、在使用Simditor的HTML页面里加入textarea文本框,比如

<textarea id="editor" placeholder="这里输入内容" autofocus></textarea>

3、在script中初始化编辑器:

var editor = new Simditor({
textarea: $('#editor')
});

效果例如以下:

假设不幸工具栏button出现例如以下样式  则仅仅需去掉html头部<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

中的PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"就可以

JSP同理

作者:itmyhome

參考:Simditor官网

Simditor用法的更多相关文章

  1. Simditor图片上传

    上一篇文章(Simditor用法)仅仅是简单的默认配置,我们可自己定义工具栏button使其更丰富和实现上传图片功能 初始化编辑器 <script type="text/javascr ...

  2. 富文本编辑器Simditor的简易使用

    最近打算自己做一个博客系统,并不打算使用帝国cms或者wordpress之类的做后台管理!自己处于学习阶段也就想把从前台到后台一起谢了.好了,废话不多说了,先来看看富文本编辑器SimDitor,这里是 ...

  3. EditText 基本用法

    title: EditText 基本用法 tags: EditText,编辑框,输入框 --- EditText介绍: EditText 在开发中也是经常用到的控件,也是一个比较必要的组件,可以说它是 ...

  4. jquery插件的用法之cookie 插件

    一.使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...

  5. Java中的Socket的用法

                                   Java中的Socket的用法 Java中的Socket分为普通的Socket和NioSocket. 普通Socket的用法 Java中的 ...

  6. [转载]C#中MessageBox.Show用法以及VB.NET中MsgBox用法

    一.C#中MessageBox.Show用法 MessageBox.Show (String) 显示具有指定文本的消息框. 由 .NET Compact Framework 支持. MessageBo ...

  7. python enumerate 用法

    A new built-in function, enumerate() , will make certain loops a bit clearer. enumerate(thing) , whe ...

  8. [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

    本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...

  9. 【JavaScript】innerHTML、innerText和outerHTML的用法区别

    用法: <div id="test">   <span style="color:red">test1</span> tes ...

随机推荐

  1. moment.js获取本周本月本年的开始日期和结束日期

    //获取本日 const startDate = moment().format('YYYY-MM-DD'); const startDate = moment().format('YYYY-MM-D ...

  2. 【jQuery02】点击标题面板显示内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. Docker本地私有仓库实战

    Docker仓库主要用于存放Docker镜像,Docker仓库分为公共仓库和私有仓库,基于registry可以搭建本地私有仓库,使用私有仓库的优点如下: 1)节省网络带宽,针对于每个镜像不用去Dock ...

  4. python yield 生成器的介绍(转载)

    您可能听说过,带有 yield 的函数在 Python 中被称之为 generator(生成器),何谓 generator ? 我们先抛开 generator,以一个常见的编程题目来展示 yield ...

  5. django 开发之自定义日志器(二)

    2016-08-24 需求 在我们的真实环境中当我们出现错误的时候我们要记录下来,便于我们分析差错. 关于日志的代码文件 # 自定义日志输出信息 LOGGING = { 'version': 1, ' ...

  6. oracle 11G 配置侦听文件

    lsnrctl status   130  2017-08-23 03:15:16 oracle cat /etc/hosts   131  2017-08-23 03:15:26 oracle ca ...

  7. Hibernate持久化步骤

      1. 读取并解析配置文件 Configuration config= new Configuration().configure(); 相当于使用DataSource获取连接前读取DataSour ...

  8. grep的使用【转】

    grep的作用是显示匹配一个或多个模式的文本行.时常会作为管道(|)的第一步,以便对匹配的数据作进一步处理.grep常用于查找和替换文本的.在传统上,grep有3个版本:grep.egrep(扩展gr ...

  9. Python中文字符问题

    Python中对中文字符的操作时常会使程序出现乱码 不全然管用的处理方法: 读取数据时使用encode编码为Bytes以保护数据 使用时转化为string并使用decode解码 如: title = ...

  10. springMVC 配置jdbcTemplate连接Oracle数据库出错

    springMVC 配置jdbcTemplate连接Oracle数据库出错 错误信息: log4j:WARN No appenders could be found for logger (org.s ...