当前位置: 首页 > 文档资料 > Simditor 中文文档 >

使用 Simditor

优质
小牛编辑
128浏览
2023-12-01

To use Simditor, first, you need a textarea element like this:

<textarea id="editor" placeholder="Balabala" autofocus></textarea>

Initialize Simditor:

var editor = new Simditor({
  textarea: $('#editor')
  //optional options
});

textarea is a required option. jQuery Object、HTML Element or Selector String can be passed to this option.

Some optional options:

  • placeholder (default: '') Placeholder of simditor. Use the placeholder attribute value of the textarea by default.
  • toolbar (default: true) - Show the toolbar buttons
  • toolbarFloat (default: true) - Fixed the toolbar on the top of the browser when scrolling.
  • toolbarHidden (default: false) - Hide the toolbar.
  • defaultImage (default: 'images/image.png') - Default image placeholder. Used when inserting pictures in Simditor.
  • tabIndent (default: true) - Use 'tab' key to make indent.
  • params (default: {}) - Insert a hidden input in textarea to store params (key-value pairs).
  • upload (default: false) - Accept false or key - value pairs. Extra options for uploading images. e.g. 'url', 'params'
  • pasteImage (default: false) - Support uploading by pasting images from clipboard. Only supported by Firefox and Chrome.

For more details please refer to Options Doc.

自定义 Simditor

simditor.css is compiled from '.scss' source file using Sass. If you want to change the style of Simditor, you can simply change simditor.scss and reproduce the CSS file.

.editor-style is the layout style of the textarea. Customize this file if you want a different text format.

Want some special interactions and features? have a look at extension library. You can also create your own extensions for Simditor. Sample extensions:

  • a feature extension: simditor-autosave
  • a button extension: simditor-mark