thinkphp3.2嵌入百度編輯器ueditor的實(shí)例代碼
本文介紹了thinkphp3.2嵌入百度編輯器ueditor,分享給大家,希望此文章對(duì)各位有所幫助
因?yàn)榕虐嬉?,很多時(shí)候我們需要嵌入富文本編輯器,輸出帶html標(biāo)簽的文本內(nèi)容。因?yàn)槲易罱鲆粋€(gè)后臺(tái)管理系統(tǒng),要求編輯好文本內(nèi)容,讓它輸出帶html標(biāo)簽的文本存到服務(wù)器,客戶端發(fā)請(qǐng)求拿到服務(wù)器的帶標(biāo)簽文本。我用的是ueditor,
1.首先我們?nèi)サ竭@里http://m.fzitv.net/codes/56667.html下載PHP版本utf版本。
把它放到Public的目錄下。

2.我們?cè)谝晥Dview上,要用到富文本編輯器的時(shí)候,一般都是在表單加入textarea,
<form> <div><textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea> </div> </form>
3.在html最后加上script配置文本框初始值,其中PUBLIC是我在config配置的路徑
<script type="text/javascript" src="__PUBLIC__/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__PUBLIC__/ueditor/ueditor.all.min.js"></script>
<!--建議手動(dòng)加在語言,避免在ie下有時(shí)因?yàn)榧虞d語言失敗導(dǎo)致編輯器加載失敗-->
<!--這里加載的語言文件會(huì)覆蓋你在配置項(xiàng)目里添加的語言類型,比如你在配置項(xiàng)目里配置的是英文,這里加載的中文,那最后就是中文-->
<script type="text/javascript" src="__PUBLIC__/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript">
UE.getEditor('intro_detail',{ //intro_detail為要編輯的textarea的id
initialFrameWidth: 418, //初始化寬度
initialFrameHeight: 500, //初始化高度
});
</script>
4.通常我們?cè)诒韱卫锩婕觽€(gè)按鈕的時(shí)候會(huì)默認(rèn)把表單里面的數(shù)據(jù)全部提交上去,但是我的項(xiàng)目里面還涉及到圖片上傳問題,我在這里采用的是ajax異步提交,那么問題來了,我們能否通過jq中的("#intro_detail").val()的值拿到要提交的值呢,答案是不能的,我的處理方法是,在textarea下面加一個(gè)隱藏的input,我門用ueditor提供的方法拿到里面的值賦給input,讓它隨著表單一起提交過去,在控制器便可以通過_POST(‘表單的name'),如下:
<div > <textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea> </div> <input type="text" style="display: none" id="intro_detail1" name="intro_detail1" >
ajax提交,
把文本框輸入的帶標(biāo)簽的用單引號(hào)拼起來,存到input里面一并發(fā)過去,至于為啥用單引號(hào),不然的話發(fā)不過去,會(huì)自動(dòng)過濾掉標(biāo)簽,我們?cè)谀脭?shù)據(jù)出來的時(shí)候把單引號(hào)處理掉就可以。
$.ajax({
type: "POST",
url: "<{:U('Admin/GameManager/Game/modGame')}>",
dataType: 'json',
processData: false,
contentType: false,
cache: false,
data: formData,
success:function(r){
if(r.success){
alert('編輯成功');
window.location.reload();//重新刷新一次
$('#user_dialog').modal('hide');
}
else{
alert("參數(shù)錯(cuò)誤");
}
}
});
5.控制器里面,可以用$_POST(‘表單的name')拿到數(shù)據(jù),寫進(jìn)數(shù)據(jù)庫
$db = M('game');
$data = $db->create(I('post.'));
$data['intro_detail'] = $_POST['intro_detail1'];
$db->add($data);
6.我們?cè)谌?shù)據(jù)到視圖的時(shí)候,把單引號(hào)處理掉就可以
foreach($result as $key =>$value){
$result[$key]['intro_detail']=str_replace("'","",$result[$key]['intro_detail']);//過濾單引號(hào)
}
$this->assign('game_list', $result);
$this->display('');
$result是我用sql語句查到的數(shù)據(jù)庫內(nèi)容,而intro_detail就是存入數(shù)據(jù)庫帶標(biāo)簽和單引號(hào)的文本內(nèi)容
$user = M('game');
$result = $user->field();
7.其實(shí)并不難,我也是為大家提供下思路,可以多多討論,我也是小白。
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- ThinkPHP中使用Ueditor富文本編輯器
- ThinkPHP自動(dòng)轉(zhuǎn)義存儲(chǔ)富文本編輯器內(nèi)容導(dǎo)致讀取出錯(cuò)的解決方法
- ThinkPHP中FCKeditor編輯器的使用方法
- TP3.2.3框架使用CKeditor編輯器在頁面中上傳圖片的方法分析
- 利用Electron簡單擼一個(gè)Markdown編輯器的方法
- 利用Vue實(shí)現(xiàn)一個(gè)markdown編輯器實(shí)例代碼
- vue中利用simplemde實(shí)現(xiàn)markdown編輯器(增加圖片上傳功能)
- SpringBoot使用Editor.md構(gòu)建Markdown富文本編輯器示例
- Thinkphp5框架中引入Markdown編輯器操作示例
相關(guān)文章
yii2 modal彈窗之ActiveForm ajax表單異步驗(yàn)證
這篇文章主要介紹了yii2 modal彈窗之ActiveForm ajax表單驗(yàn)證的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
PHP實(shí)現(xiàn)中文轉(zhuǎn)拼音的方法
這篇文章運(yùn)用簡單易懂的例子給大家介紹PHP將中文轉(zhuǎn)換成拼音的方法,代碼非常詳細(xì),感興趣的小伙伴們可以參考借鑒,希望對(duì)大家能有所幫助2023-11-11
php curl獲取到j(luò)son對(duì)象并轉(zhuǎn)成數(shù)組array的方法
今天小編就為大家分享一篇php curl獲取到j(luò)son對(duì)象并轉(zhuǎn)成數(shù)組array的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-05-05

