将 textarea 更改为 HTML WYSIWYG Raptor 编辑器

Question

我正在尝试在网站上嵌入 HTML WYSIWYG Raptor Editor。在 Raptor 网站上，directions 说只需添加以下代码：

<script type="text/javascript" src="/javascripts/raptor.min.js"></script>

<div class="raptor-editable">
    <p>
        Raptor may be integrated into a site many ways. 
        This article aims to cover the simplest integration possible.
    </p>
</div>
<script>
    jQuery(function($) {
        $('.raptor-editable').raptor();
    });
</script>

此代码应该允许用户使用编辑器编辑页面上的任何元素。

我创建了一个文本区域：

<textarea id="editor"></textarea>

当我添加以下 JavaScript 代码时，textarea 会改变大小，因此我假设代码正在执行某些操作，但是，我无法获得带有工具栏和按钮的编辑器来显示：

<script>
    jQuery(function($) {
        $('#editor').raptor();
    });
</script>

如何让编辑器出现？我做错了吗？

Answer 1

<script>
jQuery(function($) {
    $('#editor').raptor();
});
</script>

所有的“.raptor();”确实是使用 raptor api 初始化元素。

您还可以将对象传递给 .raptor({plugins:[]}) 以添加 raptor 插件 (https://www.raptor-editor.com/documentation/tutorials/plugins)。

您可能还需要添加一些预设

https://www.raptor-editor.com/demo/presets

Answer 2

原来我有另一个与 Raptor 编辑器代码冲突的 CSS 文件。

如果您遇到类似问题，我建议您删除或禁用其他 CSS 和 JS 依赖项，以查看其他文件是否包含覆盖 Raptor 代码的代码。