Question

高级文本编辑器似乎在textarea字段中提供了文本编辑按钮，类似于粗体，斜体，引号和添加图片按钮。我非常了解如何在wysiwig（drupal，joomla）中添加文字编辑器（如tinymce，Content management systems等），但我还是不确定我们是否可以将这些API添加到包含textarea字段的简单html页面中。

有没有人知道如何添加这些API？

Answer 1

使用Quill - 带API的跨浏览器富文本编辑器。

来自文档：

<!-- Create the toolbar container -->
<div id="toolbar">
  <button class="ql-bold">Bold</button>
  <button class="ql-italic">Italic</button>
</div>

<!-- Create the editor container -->
<div id="editor">
  <div>Hello World!</div>
</div>

<!-- Include the Quill library -->
<script src="http://quilljs.com/js/quill.js"></script>

<!-- Initialize Quill editor -->
<script>
  var editor = new Quill('#editor');
  editor.addModule('toolbar', { container: '#toolbar' });
</script>

Answer 2

<!DOCTYPE html>
<html>
<head>
   <script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
   <script>tinymce.init({ selector:'textarea' });</script>
</head>
<body>
   <textarea>Easy! You should check out MoxieManager!</textarea>
</body>
</html>

复制＆amp;将下面的代码段粘贴到您的HTML页面

我们可以将高级文本编辑器添加到html页面中的textarea

2 个答案: