[TOC] <!-- Quill allows several ways to customize it to suit your needs. This section is dedicated to tweaking existing functionality. See the [Modules](/docs/modules/) section for adding new functionality and the [Themes](模块modules.md) section for styling. --> Quill允许多种方式去自定义来满足你的需求。本节主要说明如何调整现有的功能。添加新功能参见[模块](模块modules.md)小节， 更改样式请参见[主题](主题themes.md)小节。 ## 容器 <!-- Quill requires a container where the editor will be appended. You can pass in either a CSS selector or a DOM object. --> Quill需要一个容器放置编辑器，可以通过一个CSS选择器或一个DOM对象来设置。 ```javascript var editor = new Quill('.editor'); // First matching element will be used ``` ```javascript var container = document.getElementById('editor'); var editor = new Quill(container); ``` ```javascript var container = $('.editor').get(0); var editor = new Quill(container); ``` ## 选项 <!-- To configure Quill, pass in an options object --> 可以通过传入option对象来配置Quill: ```javascript var options = { debug: 'info', modules: { toolbar: '#toolbar' }, placeholder: 'Compose an epic...', readOnly: true, theme: 'snow' }; var editor = new Quill('#editor', options); ``` <!-- The following keys are recognized: --> 可设置的选项值： ### bounds 默认值: `document.body` <!-- DOM Element or a CSS selector for a DOM Element, within which the editor's ui elements (i.e. tooltips, etc.) should be confined. Currently, it only considers left and right boundaries. --> 可以设置为DOM元素或代表DOM元素的CSS选择器，用来包含编辑器的UI元素（比如tooltips等等），当前只考虑左右边界。 ### debug 默认值： `warn` <!-- Shortcut for [debug](/docs/api/#debug). Note `debug` is a static method and will affect other instances of Quill editors on the page. Only warning and error messages are enabled by default. --> [debug](api/扩展extension.md)的快捷方式。注意，debug是一个静态方法并且可能影响当前页面内Quill编辑器实例。默认只显示警告和错误信息。 ### formats 默认值： All formats <!-- Whitelist of formats to allow in the editor. See [Formats](/docs/formats/) for a complete list. --> 编辑器允许的格式列表白名单。完整的列表，请见[Formats](格式formats.md)。 ### modules <!-- Collection of modules to include and respective options. See [Modules](/docs/modules/) for more information. --> 需要引入模块的集合及它们各自的选项。详情见See [Modules](模块modules.md)。 ### placeholder 默认值： None <!-- Placeholder text to show when editor is empty. --> 当编辑器为空时显示的占位符文字。 ### readOnly 默认值： `false` <!-- Whether to instantiate the editor to read-only mode. --> 是否将编辑器实例设置为只读模式。 ### scrollingContainer 默认值： `null` <!-- DOM Element or a CSS selector for a DOM Element, specifying which container has the scrollbars (i.e. `overflow-y: auto`), if is has been changed from the default `ql-editor` with custom CSS. Necessary to fix scroll jumping bugs when Quill is set to [auto grow](/playground/#autogrow) its height, and another ancestor container is responsible from the scrolling. --> 当默认的'ql-editor'元素已经被自定义CSS改变，可以设置为DOM元素或代表DOM元素的CSS选择器,指定有滚动条(`overflow-y: auto`)的容器。 当Quill被设置成自适应高度,需要修复这个滚动时跳动的bug，从而让另一个祖先容器负责滚动。 <!-- *Note: Some browsers will still jump when this value is `body`. Use a separate child `div` to avoid this.* --> *注意: 当这个值为`body`u时，某些浏览器依然会跳动，可以使用一个单独的`DIV`来避免这种情况* ### strict 默认值： `true` <!-- Some improvements and modifications, under a strict interpretation of semver, would warrant a major version bump. To prevent small changes from inflating Quill's version number, they are disabled by this `strict` flag. Specific changes can be found in the [Changelog](https://github.com/quilljs/quill/blob/master/CHANGELOG.md) and searching for "strict". Setting this to `false` opts into potential future improvements. --> 在semver的严格解释下，一些改进或修改被要求一个大版本的bump。它们通过`strict`严格标志来防止对Quill版本号进行小的更改。可以在 [Changelog](https://github.com/quilljs/quill/blob/master/CHANGELOG.md)中搜索"strict"查找具体的更改信息。设置为'flase'表示同意未来潜在的改进。 ### theme <!-- Name of theme to use. The builtin options are "bubble" or "snow". An invalid or falsy value will load a default minimal theme. Note the theme's specific stylesheet still needs to be included manually. See [Themes](主题themes.md) for more information. --> 使用主题的名称。这个内置的选项是"bubble"或"snow"。一个无效或错误的值将加载默认的最小化主题。注意，主题的样式表任需要手动包含。详情，请见[主题](主题themes.md)