程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> PHP綜合 >> ThinkPHP使用Ueditor的方法詳解

ThinkPHP使用Ueditor的方法詳解

編輯：PHP綜合

本文實例講述了ThinkPHP使用Ueditor的方法。分享給大家供大家參考，具體如下：

相信很多人現在還在用著FCkeditor，以前我也在用，可是後來發現百度的Ueditor之後，發現，Ueditor比Fckeditor更好看，操作性上也比Fckeditor好多了，所以還是嘗試著使用ueditor，但是在ThinkPHP框架下使用ueditor還是遇到了一些問題，也花費了一些時間去解決這些問題，這樣，在這裡寫一個關於ThinkPHP下使用ueditor的教程，給需要使用的人。

1、在網站的根目錄下建一個“Public”的文件夾，這個文件夾在ThinkPHP中可以用__PUBLIC__來替換，所以這樣方便我們程序的編寫，然後將ueditor文件放到這個文件夾中。

2、在我們需要使用ueditor的模板文件中導入ueditor所要使用的js和css，例如，我在App/Tpl/default/Venter/createvent.html中添加以下代碼：

<script type="text/javascript" src="__PUBLIC__/ueditor/editor_config.js"></script>
<script type="text/javascript" src="__PUBLIC__/ueditor/editor_all.js"></script>
<link rel="stylesheet" href="__PUBLIC__/ueditor/themes/default/ueditor.css"/>

3、配置Ueditor相對於網站根目錄的位置，這裡我建議使用絕對路徑，即類似於http://localhost:1080這樣的路徑，因為在網站項目的開發中，很多地方會用到ueditor，但是由於所用到的位置不同便導致當前目錄和服務器根目錄的相對路徑變化，也就使得ueditor無法使用，例如，我配置的路徑（配置文件:ueditor目錄下的editor_config.js），將一下代碼進行替換：

URL= tmp.substr(0,tmp.lastIndexOf("\/")+1).replace("_examples/","");
//這裡你可以配置成ueditor目錄在您網站的相對路徑或者絕對路徑（指以http開頭的絕對路徑）

替換成：

URL = "http://localhost:1080/Public/ueditor/";

4、下面便是一個對表單的使用的應用：

<form action="__ROOT__/index.php/Venter/ventChk" method="post">
  <script type="text/plain" id="Vent" style="width:500px;"></script>
  <input type="checkbox" name="opened" value="1"/>公開發表
  <input type="submit" value="發洩" />
</form>
<!--注冊百度ueditor-->
<script type="text/javascript">
  var editor = new baidu.editor.ui.Editor({
    toolbars:[['Spechars','Emotion','InsertImage','Bold','Italic','ForeColor','FontFamily','FontSize', ]],//自定義ueditor工具欄
    initialContent: '<span style="color:#ccc">點擊這裡發洩吧</span>',
    minFrameHeight: 100,//初始化框架大小
    autoFloatEnabled: false,//工具欄自動浮動-》關閉
    textarea:'myVent'//form表單將通過該參數獲得表單提交的數據
  });
  editor.render("Vent");
</script>
<!--百度Ueditor注冊完畢-->

如上面代碼所示，可以通過$_POST['myVent']來獲取Ueditor編輯區的內容。

5、在Thinkphp中如何去使用呢？首先要先將得到的內容提交進行轉義，這裡我們使用以下代碼：

$content = htmlspecialchars(stripslashes(POST['myVent']));

這之後的操作便是將$content插入到數據庫中（這裡不再多說）。

6、從數據中提取數據並進行轉義使得內容可以正常顯示：

$vent = new VenterModel;
$list = $vent->select();
$this->assign("list",$list)

這樣在相應的html模板中可以這樣來顯示內容：

<volist name="list" id="vo">
{$vo.content|htmlspecialchars_decode}
</volist>

這裡用到了thinkphp模板的一個用法，即可以在模板中使用函數，這裡便使用了函數htmlspecialchars_decode來對$vo,content進行轉義,上面的代碼可以看成是這樣：

htmlspecialchars_decode($vo.content)，在這裡的這個方法的選擇上我用了很長時間，當時沒有考慮到這個方法，當時只是想著，由於htmlspecialchars_decode函數接受的傳值不能是數組，所以從數據庫中提取的數據便不能直接傳給他，後來想可以通過遍歷數組的方法來讓數組內每個元素都htmlspecialchars_decode一下，雖然可以將內容轉義，但是卻不能在模板中顯示了，直到最後看了一些官方的手冊，才想到了這裡，所以做程序，一定要多看看官方的文檔，很多問題便能解決。

PS：這裡推薦幾款本站的格式化/美化/轉換工具可以幫助你整理雜亂無章的代碼，相信大家在以後的開發中能夠用得上：

php代碼在線格式化美化工具：
http://tools.jb51.net/code/phpformat

JavaScript代碼美化/壓縮/格式化/加密工具：
http://tools.jb51.net/code/jscompress

在線XML格式化/壓縮工具：
http://tools.jb51.net/code/xmlformat

JSON代碼格式化美化工具：
http://tools.jb51.net/code/json

在線XML/JSON互相轉換工具：
http://tools.jb51.net/code/xmljson

json代碼在線格式化/美化/壓縮/編輯/轉換工具：
http://tools.jb51.net/code/jsoncodeformat

sql代碼在線格式化美化工具：
http://tools.jb51.net/code/sqlcodeformat

更多關於thinkPHP相關內容感興趣的讀者可查看本站專題：《ThinkPHP入門教程》、《ThinkPHP常用方法總結》、《PHP中cookie用法總結》、《smarty模板入門基礎教程》及《PHP模板技術總結》。

希望本文所述對大家基於ThinkPHP框架的PHP程序設計有所幫助。