2014-02-08 357 views
1

我刚刚安装了ckeditor的基本级别,并发现加载每个页面加载需要相当长的时间。ckeditor缓慢加载

这里是装载的(HTML5)的gif(这是比正常稍快):gif here

我没有做任何事情,会弹出有问题,所以我不知道为什么需要这么长加载。有没有办法让textarea永远不会出现,所以它看起来不像在gif中那样“弹出”到ckeditor中?

这些是我有这个页面上唯一的JS脚本:

<script src="js/jquery.js"></script> 
<script src="js/jquery-ui.js"></script> 
<script src="ckeditor/ckeditor.js"></script> 

请帮

+0

,并将HTML /初始化代码? – Petah

+0

@Petah HTML只是一个textarea(id'text_field'),初始化代码是'CKEDITOR.replace('text_field',{customConfig:'config.js'});'。 config.js文件与ckeditor自带的默认值不同的是,我将工具栏位置放在底部。 – Walter

回答

2

替换为这些脚本:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js" type="text/javascript"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/ckeditor/4.3.2/ckeditor.min.js" type="text/javascript"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/ckeditor/4.3.2/adapters/jquery.min.js" type="text/javascript"></script> 

删除当前<textarea>和替换您当前使用的CKEDITOR.replace(...)脚本:

<script> 
    $('<textarea/>').attr('id', 'text_field').css('visibility', 'hidden').appendTo('#ckeditorArea').ckeditor(function(textField) { 
     $(textField).css('visibility', 'visible'); 
    }); 
</script> 

这使用jQuery的适配器方法.ckeditor()初始化编辑新的元件上,而不是使用传统的CKEDITOR.replace()方法。

最初,textarea将在页面中但隐藏,然后在应用CKEditor界面后可见。

+0

建议用CDN中托管的版本替换他的本地文件后,应该检查它是否确实带来了性能优势,但现在他似乎只是谈论CKEditor的初始化时间。除此之外,你现在正在包含一个额外的文件,这意味着另一个请求和一个延迟的增加,但是如果你想用它来隐藏容器并初始化一个CKEditor实例,你不需要这个。然后,您应该检查编辑器是否正常工作,因为Chrome取决于您隐藏容器的方式有问题。 – AlfonsoML

+0

最后,您需要更改编辑器容器的可见性,而不是textarea。 – AlfonsoML

+0

我同意额外的补充似乎只是增加了它,但不幸的是使用库直接需要在网络服务器**上的位置定义** ......我不知道如何处理它不在服务器全部。尽管如此,我同意可见性评论。我实际上认为为这个动作增加一点代码会产生一个值得额外处理的结果(在加载后动画不透明)。这是我使用jQuery适配器的另一个原因 - 在replace()方法上没有回调 - 但现在我想我有办法解决它。我会在完美时更新。 – Deryck