Ruby on rails 4 CKEditor cktext_区域仅在刷新页面时显示（Rails 4/Heroku）_Ruby On Rails 4_Heroku_Ckeditor

Ruby on rails 4 CKEditor cktext_区域仅在刷新页面时显示（Rails 4/Heroku）

ruby-on-rails-4 heroku ckeditor

Ruby on rails 4 CKEditor cktext_区域仅在刷新页面时显示（Rails 4/Heroku）,ruby-on-rails-4,heroku,ckeditor,Ruby On Rails 4,Heroku,Ckeditor,我的本地版本运行得很好。编辑：本地版本也做同样的事情。它也在heroku上运行，但是当我第一次加载我的创建博客文章页面时，cktext_区域显示为一个普通的文本框。当我刷新页面时，ck_文本区域会按预期显示我不知道为什么会这样这是使用Rails4 这是我的应用程序布局 <!DOCTYPE html> <html> <head> <title><%= full_title(yield(:title)) %></t

我的本地版本运行得很好。 编辑：本地版本也做同样的事情。

它也在heroku上运行，但是当我第一次加载我的创建博客文章页面时，cktext_区域显示为一个普通的文本框。当我刷新页面时，ck_文本区域会按预期显示

我不知道为什么会这样

这是使用Rails4

这是我的应用程序布局

    <!DOCTYPE html>
<html>
<head>
  <title><%= full_title(yield(:title)) %></title>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
    <%= csrf_meta_tags %>
</head>
<body>
    <%= render 'layouts/header' %>
    <div class="container">
        <% if notice %>
          <p class="alert alert-success"><%= notice %></p>
        <% end %>
        <% if alert %>
          <p class="alert alert-danger"><%= alert %></p>
        <% end %>
        <%= yield %>
        <%= render 'layouts/footer' %>
    </div>
</body>

</html>

和我的博客创建表单

<%= form_for @article do |f| %>

  <% if @article.errors.any? %>
    <div id="error_explanation">
      <h2>
        <%= pluralize(@article.errors.count, "error") %> prohibited
        this article from being saved:
      </h2>
      <ul>
        <% @article.errors.full_messages.each do |msg| %>
          <li><%= msg %></li>
        <% end %>
      </ul>
    </div>
  <% end %>

  <p>
    <%= f.label :title %><br>
    <%= f.text_field :title, :size=>'50' %>
  </p>

  <p>
    <%= f.label :text %><br>
    <%= f.cktext_area :text %>
  </p>

  <p>
    <%= f.submit %>
  </p>

<% end %>


禁止
要保存此文章，请执行以下操作：






'50' %>

好的。好。这不是一个完整的解决方案，但删除TurboLink可以解决此问题。我的项目当然不需要turbolinks，但最终找到一个包含turbolinks的解决方案会很好

已从application.js中删除

/=require turbolinks

//= require jquery
//= require jquery_ujs
//= require bootstrap-sprockets
//= require turbolinks
//= require ckeditor/init
//= require_tree .

看起来CKEditor对turbolinks不太好。我没有禁用turbolink，而是简单地向任何包含ckeditor的链接添加了

数据：{'no turbolink'=>true}

例如，在我的标题中，我有一个创建新博客帖子的链接：

<%= link_to "Create New Blog Post", new_article_path, data: { 'no-turbolink'=>true} %>

true}%>

这为我解决了问题，但没有完全删除TurboLink。

我知道我参加聚会迟到了，但可能会对某人有所帮助

问题在于，在访问TurboLink后，ckeditor没有初始化。因此，解决方案是在每次TurboLink加载页面时重新初始化ckeditor

这可以使用

turbolinks:load

（第页：旧版本的加载）

第二个问题是，

turbolinks:load

每次都会触发，即使是在文档就绪事件上。因此，我必须以某种方式检查ckeditor是否已初始化，否则我将获得编辑器实例。。。已附加到提供的元素。

最终代码为：

$(document).on('turbolinks:load', function() {
  $('.ckeditor:visible').each(function() {
    var id = $(this).attr('id');
    if (!CKEDITOR.instances[id]) {
       CKEDITOR.replace(id);
    }});
});

您在应用程序布局中的何处加载JS？我发现在页面底部加载它（在定义了所有元素之后）可以确保在JS加载时元素可用。Steve添加了我的文件。我不确定在哪里加载js以使其工作。当我在底部加载它时，我遇到了一个错误。尝试将

javascript\u include\u标记

行移动到布局中的页脚行之后（关闭容器之前）。这样做很有效，但有时会破坏页眉中的引导下拉菜单。就像，它会冻结直到我清醒。。。我不太精通javascript：（它不应该破坏任何东西。我想知道你是否两次错误地加载了bootstrap或其他JS。