Ueditor自定義默認寬度高度


如題。

        最近需要使用到網頁后台富文本編輯器。經過同學推薦,最后決定使用百度家的Ueditor.

官方地址:http://ueditor.baidu.com/website/

貼吧地址:ueditor討論吧

官方提供了網頁上非常方便的自定義工具欄的功能。自定義之后直接下載對應的代碼包並按照文檔部署到項目中即可。其中主要的問題是路徑的配置。

首先是將下載好的代碼包發布到我們項目的根目錄下面。然后在需要添加富文本編輯器的頁面頭部添加如下代碼:

        

[javascript]  view plain copy print ? 在CODE上查看代碼片 派生到我的代碼片
  1. <script type="text/javascript" src="相對該文檔的路徑/ueditor/ueditor.config.js"></script>  
  2. <script type="text/javascript" src="相對該文檔的路徑/ueditor/ueditor.all.js"></script>  
  3. <script>  
  4. <span style="white-space:pre">  </span>window.UEDITOR_HOME_URL = "/項目相對網址池絕對路徑/ueditor";  
  5. </script>  

配置路徑這一塊是非常重要的。特別是下面的Ueditor的路徑,是相對我們整個代碼庫的目錄的。

 

配置完成之后,直接在我們網頁中的<textarea>標簽下面添加ueditor的初始化代碼:

 

[javascript]  view plain copy print ? 在CODE上查看代碼片 派生到我的代碼片
  1. <script type="text/javascript">  
  2.     var editor = new UE.ui.Editor({initialFrameHeight:100,initialFrameWidth:400 });  
  3.         editor.render("actDescribe");  
  4. </script>  

 

官方的文檔並沒有給出如何設置ueditor的寬度和高度的說明。這是我在網上網友那里找到的解決方法。在聲明編輯器的變量的時候,在參數列表中添加對initialFrameHeight和initialFrameWidth的設置即可。注意,數值后面不需要添加px。

 

 

可是,這種方法有時候奏效有時候也不奏效,因為我碰過一種情況就是無論如何調整initialHeight和initialWidth的數值,編輯器的大小都還是不會改變。這個時候,我發現,可以通過調整editor所跟隨的textarea的寬高來撐開editor的大小。這也是一種方法,各位同學在官方說明文檔出來之前可以兩種方法都嘗試一下。

 

當然,好用的文本編輯器還是有很多的,例如kindeditor,之前准備使用這個的,而其文檔方面也比較齊全,同時,整個編輯器的size也比較小,對網頁的加載速度比較有利。百度的Ueditor還是有點龐大。加載時會有卡頓的速度。估計是我對底層代碼的研究不夠,多了很多不必要的內容。慢慢研究或許可以使得Ueditor變小。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM