2014-02-08 236 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