Rumah > pembangunan bahagian belakang > tutorial php > tp3怎么嵌入百度编辑器ueditor?

tp3怎么嵌入百度编辑器ueditor?

零下一度
Lepaskan: 2023-03-14 08:00:02
asal
2438 orang telah melayarinya

载入百度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>
Salin selepas log masuk

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(&#39;intro_detail&#39;,{  //intro_detail为要编辑的textarea的id
    initialFrameWidth: 418,  //初始化宽度
    initialFrameHeight: 500,  //初始化高度
  });

</script>
Salin selepas log masuk

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" >
Salin selepas log masuk

ajax提交,

代码如下:

$("#intro_detail1").val("&#39;"+UE.getEditor(&#39;intro_detail&#39;).getContent()+"&#39;");
Salin selepas log masuk

把文本框输入的带标签的用单引号拼起来,存到input里面一并发过去,至于为啥用单引号,不然的话发不过去,会自动过滤掉标签,我们在拿数据出来的时候把单引号处理掉就可以。


$.ajax({
          type: "POST",
          url: "<{:U(&#39;Admin/GameManager/Game/modGame&#39;)}>",
          dataType: &#39;json&#39;,
          processData: false,
          contentType: false,
          cache: false,
          data: formData,
          success:function(r){
            if(r.success){
              alert(&#39;编辑成功&#39;);
              window.location.reload();//重新刷新一次
              $(&#39;#user_dialog&#39;).modal(&#39;hide&#39;);
            }
            else{
              alert("参数错误");
            }
          }
        });
Salin selepas log masuk

5.控制器里面,可以用$_POST(‘表单的name')拿到数据,写进数据库


$db = M(&#39;game&#39;);
    $data  = $db->create(I(&#39;post.&#39;));
    $data[&#39;intro_detail&#39;] = $_POST[&#39;intro_detail1&#39;];
    $db->add($data);
Salin selepas log masuk

6.我们在取数据到视图的时候,把单引号处理掉就可以


foreach($result as $key =>$value){    
      $result[$key][&#39;intro_detail&#39;]=str_replace("&#39;","",$result[$key][&#39;intro_detail&#39;]);//过滤单引号
    }
    $this->assign(&#39;game_list&#39;, $result);
    $this->display(&#39;&#39;);
Salin selepas log masuk

$result是我用sql语句查到的数据库内容,而intro_detail就是存入数据库带标签和单引号的文本内容


$user = M(&#39;game&#39;);
    $result = $user->field();
Salin selepas log masuk

7.其实并不难,我也是为大家提供下思路,可以多多讨论,我也是小白。

Atas ialah kandungan terperinci tp3怎么嵌入百度编辑器ueditor?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan