【发布时间】：2017-12-01 04:05:30
【问题描述】：
我刚刚在我当前使用的 Rails 应用程序和 turbolinks 中安装了 ckeditor gem。我按照https://github.com/galetahub/ckeditor 的说明安装了gem。安装后应用程序未在 post#new 中呈现 ckeditor，我认为它与 turbolinks 有关。关于如何解决的任何想法？
applicaiton.html.erb 中的以下内容似乎是罪魁祸首
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
宝石文件
gem 'turbolinks'
gem 'ckeditor', '4.1.3'
应用程序.js
//= require jquery
//= require jquery.turbolinks
//= require jquery.validate
//= require jquery_ujs
//= require ckeditor/init
//= require ckeditor/config
//= require maps
//= require map_theme/vendor/modernizr.custom
//= require map_theme/vendor/matchMedia
//= require map_theme/vendor/bootstrap
//= require map_theme/vendor/jquery.storageapi
//= require map_theme/vendor/jquery.easing
//= require map_theme/vendor/animo
//= require map_theme/vendor/jquery.slimscroll.min
//= require map_theme/vendor/screenfull
//= require bootstrap-datepicker/core
//= require map_theme/demo/demo-rtl
//= require map_theme/vendor/index
//= require map_theme/vendor/jquery.classyloader.min
//= require map_theme/vendor/moment-with-locales.min
//= require map_theme/app
//= require reports
//= require users
//= require turbolinks
application.html.erb
<head>
<script src="https://use.typekit.net/yzs0vln.js"></script>
<script>
try{Typekit.load({ async: true });}catch(e){}
</script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= javascript_include_tag "https://js.stripe.com/v3/" %>
<%= csrf_meta_tags %>
</head>
帖子表单
<div class="panel-body text-md">
<%= form_for @post, html: { multipart: true } do |f| %>
<div class="field form-group">
<%= f.label :image %> <br>
<%= f.file_field :image %>
</div>
<div class="field form-group">
<%= f.label :title %> <br>
<%= f.text_field :title, class: 'form-control' %>
</div>
<div class="field form-group">
<%= f.label :body %> <br>
<%= f.cktext_area :body, class: 'form-control' %>
</div>
<div class="field form-group">
<%= f.label :youtube_id %> <br>
<%= f.text_field :youtube_id, class: 'form-control' %>
</div>
<div class="field form-group">
<%= f.submit class: "btn btn-inverse btn-md"%> <br>
</div>
<% end %>
</div>
config.js
CKEDITOR.editorConfig = function( config ) {
config.language = 'en';
config.uiColor = '#ffffff';
/* Filebrowser routes */
// The location of an external file browser, that should be launched when "Browse Server" button is pressed.
config.filebrowserBrowseUrl = "/ckeditor/attachment_files";
// The location of an external file browser, that should be launched when "Browse Server" button is pressed in the Flash dialog.
config.filebrowserFlashBrowseUrl = "/ckeditor/attachment_files";
// The location of a script that handles file uploads in the Flash dialog.
config.filebrowserFlashUploadUrl = "/ckeditor/attachment_files";
// The location of an external file browser, that should be launched when "Browse Server" button is pressed in the Link tab of Image dialog.
config.filebrowserImageBrowseLinkUrl = "/ckeditor/pictures";
// The location of an external file browser, that should be launched when "Browse Server" button is pressed in the Image dialog.
config.filebrowserImageBrowseUrl = "/ckeditor/pictures";
// The location of a script that handles file uploads in the Image dialog.
config.filebrowserImageUploadUrl = "/ckeditor/pictures?";
// The location of a script that handles file uploads.
config.filebrowserUploadUrl = "/ckeditor/attachment_files";
config.allowedContent = true;
// Toolbar groups configuration.
config.toolbar = [
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source'] },
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ], items: [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] },
// { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ], items: [ 'Find', 'Replace', '-', 'SelectAll', '-', 'Scayt' ] },
// { name: 'forms', items: [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },
{ name: 'links', items: [ 'Link', 'Unlink', 'Anchor' ] },
{ name: 'insert', items: [ 'Image', 'Flash', 'Table', 'HorizontalRule', 'SpecialChar' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] },
'/',
{ name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
{ name: 'colors', items: [ 'TextColor', 'BGColor' ] },
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] }
];
config.toolbar_mini = [
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] },
{ name: 'styles', items: [ 'Font', 'FontSize' ] },
{ name: 'colors', items: [ 'TextColor', 'BGColor' ] },
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] },
{ name: 'insert', items: [ 'Image', 'Table', 'HorizontalRule', 'SpecialChar' ] }
];
};
【问题讨论】：
标签： javascript ruby-on-rails ruby-on-rails-4 ckeditor turbolinks