一不小心接触到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')
});

效果如下:

如果不幸工具栏按钮出现如下样式  则只需去掉html头部<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

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

JSP同理

作者:itmyhome

参考:Simditor官网

Simditor使用方法的更多相关文章

  1. javaSE27天复习总结

    JAVA学习总结    2 第一天    2 1:计算机概述(了解)    2 (1)计算机    2 (2)计算机硬件    2 (3)计算机软件    2 (4)软件开发(理解)    2 (5) ...

  2. Simditor 富文本编辑器多选图片上传、视频连接插入

    simditor 是一个基于浏览器的所见即所得的文本编辑器.Simditor 富文本编辑器, 支持多选图片上传, 视频连接插入, HTML代码编辑以及常用富文本按钮,支持的浏览器:IE10.Firef ...

  3. Simditor学习--vuejs集成simditor

    唠叨 因为项目需要我自己研究了和集成在vue方便以后再使用,详情官方文档在这里.希望大家有好的建议提出让我继续改进. simditor介绍 Simditor 是团队协作工具 Tower 使用的富文本编 ...

  4. react构建前端项目方法汇总

    react简介: 一.使用react 创建一个PC端的项目 (a):使用 yemon 创建一个 webpack 的 react 的项目 控制台安装并且产看 yemon 的版本 yo -v (b): 全 ...

  5. ava StringTokenizer 类使用方法

    菜鸟教程 -- 学的不仅是技术,更是梦想! 首页 笔记首页 Android 互联网 程序员人生 程序员笑话 编程技术 红包 知识店铺 --> 首页 Android 鸡汤 逗乐 Search Ja ...

  6. mapreduce多文件输出的两方法

    mapreduce多文件输出的两方法   package duogemap;   import java.io.IOException;   import org.apache.hadoop.conf ...

  7. 【.net 深呼吸】细说CodeDom(6):方法参数

    本文老周就给大伙伴们介绍一下方法参数代码的生成. 在开始之前,先补充一下上一篇烂文的内容.在上一篇文章中,老周检讨了 MemberAttributes 枚举的用法,老周此前误以为该枚举不能进行按位操作 ...

  8. IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法

    直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...

  9. 多线程爬坑之路-Thread和Runable源码解析之基本方法的运用实例

    前面的文章:多线程爬坑之路-学习多线程需要来了解哪些东西?(concurrent并发包的数据结构和线程池,Locks锁,Atomic原子类) 多线程爬坑之路-Thread和Runable源码解析 前面 ...

随机推荐

  1. 采用tcpdump攫Android网络数据包

    1 空灵的原理 tcpdump(需Root用户执行)拦截和显示发送或收到过网络连接到该机器的TCP/IP和其它数据包.简单说就监控手机进出网络数据. 2 方法优劣 2.1长处 1.手机数据包无遗漏 2 ...

  2. 蓝桥杯 BASIC 27 矩阵乘法(矩阵、二维数组)

    [思路]:注意0次幂是单位矩阵. [AC代码]: #include <iostream> #include <algorithm> #include <iomanip&g ...

  3. Android:仿手机QQ朋友动态ListView

    1.介绍: 使用此博客XListView模仿Android版本QQ朋友动态ListView效果.效果如下面的截图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZ ...

  4. [CLR via C#]4. 类型基础及类型、对象、栈和堆运行时的相互联系

    原文:[CLR via C#]4. 类型基础及类型.对象.栈和堆运行时的相互联系 CLR要求所有类型最终都要从System.Object派生.也就是所,下面的两个定义是完全相同的, //隐式派生自Sy ...

  5. 基于tomcat为了应对高并发模型实现webserver

    在博客上,一个简单的AIOweb来样加工.查看AIO异步处理,依靠操作系统完成IO操作Proactor处理模型确实很强大,它可以实现高并发.高响应server一个很好的选择,但在tomcat中间con ...

  6. Redis 优化查询性能

    一次使用 Redis 优化查询性能的实践   应用背景 有一个应用需要上传一组ID到服务器来查询这些ID所对应的数据,数据库中存储的数据量是7千万,每次上传的ID数量一般都是几百至上千数量级别. 以前 ...

  7. php中ssl开发的若干问题

    最近利用php开发ssl的相关功能,由于第一次做相关的事情,遇到了很多问题,庆幸的是最终都顺利解决了.不过相关的资料很少,都是综合了国内外的相关信息才解决的.现在整理一下,方便后来者遇到问题时解决. ...

  8. 于CentOS 6 安装 Wordpress

    1.两种方式给Wordpress 首先,你可以去wordpress最新的官方网站看看wordpress多少下载.例wordpress 3.9.1下载地址: http://cn.wordpress.or ...

  9. 查看oracle数据库服务器的名字

    原文:查看oracle数据库服务器的名字 windows 中 1. select name from v$database ; 直接运行就可以查看了, 2.查看tnsnames.ora 的连接,有个S ...

  10. Android摘要ImageView的scaleType属性

    Android在ImageView的scaleType有8一个选项 1 matrix不正确图像放大,原来自view在左上角绘制图片(片不变形): 2 fitXY将图片所有绘制到view中,可是图片会变 ...