一不小心接触到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. NodeJS学习笔记 (1)资源压缩-zlib(ok)

    原文: https://github.com/chyingp/nodejs-learning-guide/blob/master/README.md 自己的跟进学习: 概览 做过web性能优化的同学, ...

  2. Mint-UI 没有样式?

    如果用mint-ui组件,如toast没有样式,是因为没有映入全局样式和导入MintUI 方法如下: 1.安装 npm install mint-ui -S -S表示 --save 2.在main.j ...

  3. 虚拟集群LVS及DR模式搭建笔记

    LVS(虚拟集群Linux Virtual Server) LVS-NAT:地址转换,数据包来回都要经过NAT转换,所以Director Server(即LVS服务器)将成为系统瓶颈.使用NAT模式将 ...

  4. C++ vector基本用法

    转自金河http://www.cnblogs.com/wang7/archive/2012/04/27/2474138.html 1 基本操作 (1)头文件#include<vector> ...

  5. Docker学习总结(8)——利用Docker开启持续交付之路

    持续交付即Continuous Delivery,简称CD,随着DevOps的流行正越来越被传统企业所重视.持续交付讲求以短周期.小细粒度,自动化的方式频繁的交付软件,在这个过 程中要求开发.测试.用 ...

  6. hdu 4786 Fibonacci Tree 乱搞 智商题目 最小生成树

    首先计算图的联通情况,如果图本身不联通一定不会出现生成树,输出"NO",之后清空,加白边,看最多能加多少条,清空,加黑边,看能加多少条,即可得白边的最大值与最小值,之后判断Fibo ...

  7. IOS中UIImagePickerController中文界面问题

    今天沈阳斌子,写IOS项目遇到一个调用照相机的问题,找到解决方法,高速攻克了拿给PM看,结果PM说程序调用的照相机不是中文的是英文的.必须改成中文.上网找到了方法.试用后好用拿出来和大家分享.方法例如 ...

  8. hdu 4841 圆桌问题(用vector模拟约瑟夫环)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4841 圆桌问题 Time Limit: 3000/1000 MS (Java/Others)    M ...

  9. 微信开发出现 redirect-uri參数错误原因是设置回调页面域名不要加HTTP://

    OAuth2.0 网页授权设置.回调页面域名不要加HTTP:// NND  微信的研发.你程序处理下非常麻烦吗?给个提示非常麻烦吗?让我查了1个多小时.

  10. MapReduce 的类型与格式【编写最简单的mapreduce】(1)

    hadoop mapreduce 中的map 和reduce 函数遵循下面的形式 map: (K1, V1) → list(K2, V2) reduce: (K2, list(V2)) → list( ...