tp3怎麼嵌入百度編輯器ueditor?

來源:互聯網
上載者:User
載入百度ueditor編輯器並配置的方法分享
其實很簡單,不過讀取資料的時候需要用htmlspecialchars_decode($str);函數轉義一下,不然讀取到的內容有點小問題,具體看詳情

因為排版要求,很多時候我們需要嵌入富文字編輯器,輸出帶html標籤的常值內容。因為我最近做一個後台管理系統,要求編輯好常值內容,讓它輸出帶html標籤的文本存到伺服器,用戶端發請求拿到伺服器的帶標籤文本。我用的是ueditor,

1.首先我們去到這裡www.jb51.net/codes/56667.html下載PHP版本utf版本。

把它放到Public的目錄下。

2.我們在視圖view上,要用到富文字編輯器的時候,一般都是在表單加入textarea,


<form>  <p><textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea> </p></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><!--建議手動加在語言,避免在ie下有時因為載入語言失敗導致編輯器載入失敗--><!--這裡載入的語言檔案會覆蓋你在設定項目裡添加的語言類型,比如你在設定項目裡配置的是英文,這裡載入的中文,那最後就是中文--><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.通常我們在表單裡面加個按鈕的時候會預設把表單裡面的資料全部提交上去,但是我的項目裡面還涉及到圖片上傳問題,我在這裡採用的是ajax非同步提交,那麼問題來了,我們能否通過jq中的("#intro_detail").val()的值拿到要提交的值呢,答案是不能的,我的處理方法是,在textarea下面加一個隱藏的input,我門用ueditor提供的方法拿到裡面的值賦給input,讓它隨著表單一起提交過去,在控制器便可以通過_POST(‘表單的name'),如下:


 <p >  <textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea></p> <input type="text" style="display: none" id="intro_detail1" name="intro_detail1" >

ajax提交,

代碼如下:

$("#intro_detail1").val("'"+UE.getEditor('intro_detail').getContent()+"'");

把文字框輸入的帶標籤的用單引號拼起來,存到input裡面一併發過去,至於為啥用單引號,不然的話發不過去,會自動過濾掉標籤,我們在拿資料出來的時候把單引號處理掉就可以。


$.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("參數錯誤");            }          }        });

5.控制器裡面,可以用$_POST(‘表單的name')拿到資料,寫進資料庫


$db = M('game');    $data  = $db->create(I('post.'));    $data['intro_detail'] = $_POST['intro_detail1'];    $db->add($data);

6.我們在取資料到視圖的時候,把單引號處理掉就可以


foreach($result as $key =>$value){          $result[$key]['intro_detail']=str_replace("'","",$result[$key]['intro_detail']);//過濾單引號    }    $this->assign('game_list', $result);    $this->display('');

$result是我用sql語句查到的資料庫內容,而intro_detail就是存入資料庫帶標籤和單引號的常值內容


$user = M('game');    $result = $user->field();

7.其實並不難,我也是為大家提供下思路,可以多多討論,我也是小白。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.