javascript - TinyMCE 编辑器未初始化

Question

我正在 Ruby on Rails 中构建一个简单的 CMS，我决定使用带有语法突出显示的 WYSIWYG 编辑器，所以我选择了 TinyMCE。不过，在尝试使用它时，我遇到了几个问题:

第一问题是我在尝试使用 CMS 运行测试博客时遇到错误。首先我包括

s.add_dependency "tinymce-rails"

进入mycms.gemspec并运行

$ bundle install

然后我添加

//= require tinymce 

插入我的 CMS 中的 application.js 中。但是，当我将 CMS 插件(作为单独的 gem 提供)纳入我的测试博客时，由于错误，我无法访问我的管理面板 - Rails 无法找到 tinymce 并且我需要将 gem tinymce-rails 也包含在我的测试应用程序的 Gemfile 中以使其正常工作。 (我在 gem bootstrap-sass 上也遇到了同样的问题——只有在将其包含到应用程序的 Gemfile 中后它才起作用，尽管它存在于 mycms.gemspec

第二个问题是编辑器本身没有初始化并且没有显示在我的页面中。因此，表单本身如下:

<%= form_for (@entry, as: :entry, url: entries_path) do |f| %>
  <p>
    <%= f.label :title %> <br/>
    <%= f.text_field :title %>
  </p>
  <% @entry.class.content_attributes.each do |attr_name, attr_type| %>
    <p>
      <%= f.label :title %><br />
      <%= f.text_area attr_name, as: attr_type, class:"tinymce", rows:"40", cols:"120" %>
    </p>
  <% end %>
<% end %>
<%= tinymce %>

并且文本区域丢失了。我尝试了所有变体——包括

//= require tinymce

或

//= require tinymce-jquery

都进入测试应用的 application.js 或 CMS 的 application.js，以及添加

<%= tinymce_assets %>

直接在表单的开头，但这些变体都不起作用。我错过了什么或做错了什么？

我的 CMS 的完整代码可以在 Github 上找到。

Answer 1

如果您尚未添加此 JavaScript 代码，请尝试添加此代码:

$(document).ready(function() {
  return tinymce.init({
    selector: 'textarea',
    height: 100,
    width: 550,
    menubar: false,
    plugins: ['image', 'charmap', 'uploadimage'],
    toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link uploadimage | charmap ',
    theme: 'modern',
    relative_urls: false,
    remove_script_host: false,
    document_base_url: (!window.location.origin ? window.location.protocol + '//' + window.location.host : window.location.origin) + '/',
    setup: function(ed) {
      ed.on('init', function() {
        ed.getDoc().body.style.fontSize = '14px';
      });
      ed.on('change', function() {
        ed.save();
      });
    }
  });
});