官方下載:
/website/download.html
官網上下載完整源碼包,解壓到任意目錄,解壓後的源碼目錄結構如下所示:
_examples:編輯器完整版的示例頁面
dialogs:彈出對話框對應的資源和JS文件
themes:樣式圖片和樣式文件
php/jsp/.net:涉及到服務器端操作的後臺文件,根據妳選擇的不同後臺版本,這裏也會不同,這裏應該是jsp,php,.net
third-party:第三方插件(包括代碼高亮,源碼編輯等組件)
editor_all.js:_src目錄下所有文件的打包文件
editor_all_min.js:editor_all.js文件的壓縮版,建議在正式部署時才采用
editor_config.js:編輯器的配置文件,建議和編輯器實例化頁面置於同壹目錄
第壹步:在項目的任壹文件夾中建立壹個用於存放UEditor相關資源和文件的目錄,此處在項目根目錄下建立,起名為ueditor(自己喜歡)。
第二步:拷貝源碼包中的dialogs、themes、third-party、editor_all.js和editor_config.js到ueditor文夾中。其中,除了ueditor目錄之外的其余文件均為具體項目文件,此處所列僅供示例。
第三步:為簡單起見,此處將以根目錄下的index.php頁面作為編輯器的實例化頁面,用來展示UEditor的完整版效果。在index.php文件中,首先導入編輯器需要的三個入口文件.
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>編輯器完整版實例</title>
<script type="text/javascript" src="ueditor/editor_config.js"></script>
<script type="text/javascript" src="ueditor/editor_all.js"></script>
第四步:然後在index.php文件中創建編輯器實例及其DOM容器。具體代碼示例如下
<textarea name="後臺取值的key" id="myEditor">這裏寫妳的初始化內容</textarea>
<script type="text/javascript">
var editor = new UE.ui.Editor();
editor.render("myEditor");
//1.2.4以後可以使用壹下代碼實例化編輯器
//UE.getEditor('myEditor')
</script>
最後壹步: 在/UETest/ueditor/ editor_config.js中查找URL變量配置編輯器在妳項目中的路
壹個完整的編輯器實例就已經部署到咱們的項目中了!在瀏覽器中輸入http://localhost/UETest 運行下試試UE強大的功能吧