1. 程式人生 > >thinkphp5下百度富文字框UEditor的使用

thinkphp5下百度富文字框UEditor的使用

1到官網下載 UEditor 最新版

2解壓下載的包,將解壓後的目錄放到thinkphp public資料夾下


3. 引用時    html頁面

<body><!-- 載入編輯器的容器 --><scriptid="container"name="content"type="text/plain">這裡寫你的初始化內容</script><!-- 配置檔案 --><scripttype="text/javascript"src="ueditor.config.js"></script><!-- 編輯器原始碼檔案 -->
<scripttype="text/javascript"src="ueditor.all.js"></script><!-- 例項化編輯器 --><scripttype="text/javascript">var ue = UE.getEditor('container');
//對編輯器的操作最好在編輯器ready之後再做
ue.ready(function(){//設定編輯器的內容
    ue.setContent('hello');//獲取html內容,返回: <p>hello</p>var html = ue.getContent();
//獲取純文字內容,返回: hellovar txt = ue.getContentTxt();});
</script></body>

4 儲存資料庫時 把html內容直接存到資料庫結課

5.資料呈現時 引入

<script src="__STATIC__/Ueditor/ueditor.parse.js"></script>

檔案  直接模板樣式輸出即可(注意  控制器傳到模板的資料需要json話   如果為了減少出錯率  可以直接ajax請求資料返回使用)


另:

官網下載的ueditor demo直接上傳程式碼都會出錯,根據錯誤連結一步一步追蹤,發現錯誤程式碼出現在 ueditor

/php/Uploader.class.php中

1//$this->stateMap['ERROR_TYPE_NOT_ALLOWED'] = iconv('unicode', 'utf-8', $this->stateMap['ERROR_TYPE_NOT_ALLOWED']);

註釋這行即可