quill.js

quill.js 介绍

quill.js是一款强大的现代富文本编辑器插件。该富文本编辑器插件支持所有的现代浏览器、平板电脑和手机。它提供了文本编辑器的所有功能，并为开发者提供大量的配置参数和方法。 

quill.js使用方法

在页面中引入编辑器主题颜色文件quill.sNow.css，以及quill.js文件。

<link href="http://cdn.quilljs.com/1.0.0/quill.sNow.css" rel="stylesheet">

<script src="http://cdn.quilljs.com/1.0.0/quill.js"></script>

下面是quill.js的CDN加速地址：

<!-- Main quill library -->

<script src="//cdn.quilljs.com/1.0.3/quill.js" type="text/JavaScript"></script>

<script src="//cdn.quilljs.com/1.0.3/quill.min.js" type="text/JavaScript"></script>

<!-- Theme included stylesheets -->

<link href="//cdn.quilljs.com/1.0.3/quill.sNow.css" rel="stylesheet">

<link href="//cdn.quilljs.com/1.0.3/quill.bubble.css" rel="stylesheet">

<!-- Core build with no theme,formatting,non-essential modules -->

<link href="//cdn.quilljs.com/1.0.3/quill.core.css" rel="stylesheet">

<script src="//cdn.quilljs.com/1.0.3/quill.core.js" type="text/JavaScript"></script>

 html结构

使用下面的代码作为文本编辑器的html结构：

<!-- 创建工具栏组件 -->

<div id="toolbar">

<button class="ql-bold">Bold</button>

<button class="ql-italic">Italic</button>

</div>

<!-- 创建文本编辑器 -->

<div id="editor">

<p>Hello World!</p>

</div>

 初始化插件

在页面DOM元素加载完毕之后，通过下面的方法来实例化一个编辑器对象。

var editor = new quill('#editor',{

modules: { toolbar: '#toolbar' },

theme: 'sNow'

});

 

网站地址:https://quilljs.com/

GitHub:https://github.com/quilljs/quill

网站描述:强大，丰富的文本编辑器

quill.js

官方网站：https://quilljs.com/