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/
小编说
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。