thinkphp3.2嵌入百度编辑器ueditor的实例代码


Posted in PHP onJuly 13, 2017

本文介绍了thinkphp3.2嵌入百度编辑器ueditor,分享给大家,希望此文章对各位有所帮助

因为排版要求,很多时候我们需要嵌入富文本编辑器,输出带html标签的文本内容。因为我最近做一个后台管理系统,要求编辑好文本内容,让它输出带html标签的文本存到服务器,客户端发请求拿到服务器的带标签文本。我用的是ueditor,

1.首先我们去到这里https://3water.com/codes/56667.html下载PHP版本utf版本。

把它放到Public的目录下。

thinkphp3.2嵌入百度编辑器ueditor的实例代码

2.我们在视图view上,要用到富文本编辑器的时候,一般都是在表单加入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>
<!--建议手动加在语言,避免在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'),如下:

<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提交,

$("#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.其实并不难,我也是为大家提供下思路,可以多多讨论,我也是小白。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
BBS(php &amp; mysql)完整版(七)
Oct 09 PHP
ob_start(),ob_start('ob_gzhandler')使用
Dec 25 PHP
火车头采集器3.0采集图文教程
Mar 17 PHP
PHP 面向对象 PHP5 中的常量
May 05 PHP
php读取二进制流(C语言结构体struct数据文件)的深入解析
Jun 13 PHP
destoon会员注册提示“数据校验失败(2)”解决方法
Jun 21 PHP
PHP使用CURL_MULTI实现多线程采集的例子
Jul 29 PHP
PHP的pcntl多进程用法实例
Mar 19 PHP
php实现的SSO单点登录系统接入功能示例分析
Oct 12 PHP
PHP插件PHPMailer发送邮件功能
Feb 28 PHP
Laravel学习教程之本地化模块
Aug 18 PHP
Laravel 验证码认证学习记录小结
Dec 20 PHP
PHP微信PC二维码登陆的实现思路
Jul 13 #PHP
PHP基于socket实现客户端和服务端通讯功能
Jul 13 #PHP
php中请求url的五种方法总结
Jul 13 #PHP
Laravel 5.4重新登录实现跳转到登录前页面的原理和方法
Jul 13 #PHP
php获取'/'传参的值简单方法
Jul 13 #PHP
php多文件打包下载的实例代码
Jul 12 #PHP
php实现网页端验证码功能
Jul 11 #PHP
You might like
PHP中用header图片地址 简单隐藏图片源地址
2008/04/09 PHP
最新的php 文件上传模型,支持多文件上传
2009/08/13 PHP
php程序总是提示验证码输入有误解决方案
2015/01/07 PHP
php表单文件iframe异步上传实例讲解
2017/07/26 PHP
jQuery弹出(alert)select选择的值
2013/04/21 Javascript
jQuery弹性滑动导航菜单实现思路及代码
2013/05/02 Javascript
js获取IP和PcName(IE)在vs中可用
2013/08/02 Javascript
深入理解javascript原型链和继承
2014/09/23 Javascript
js图片轮播手动切换效果
2015/11/10 Javascript
基于jQuery实现响应式圆形图片轮播特效
2015/11/25 Javascript
jQuery中数据缓存$.data的用法及源码完全解析
2016/04/29 Javascript
jQuery回到顶部的代码
2016/07/09 Javascript
vue-cli如何快速构建vue项目
2017/04/26 Javascript
Angular2 组件通信的实例代码
2017/06/23 Javascript
Angular 5.0 来了! 有这些大变化
2017/11/15 Javascript
vue2.0在没有dev-server.js下的本地数据配置方法
2018/02/23 Javascript
spring+angular实现导出excel的实现代码
2019/02/27 Javascript
vue-dplayer 视频播放器实例代码
2019/11/08 Javascript
javascript canvas检测小球碰撞
2020/04/17 Javascript
微信小程序仿抖音短视频切换效果的实例代码
2020/06/24 Javascript
使用C语言来扩展Python程序和Zope服务器的教程
2015/04/14 Python
在Django的视图中使用form对象的方法
2015/07/18 Python
Python实现的RSS阅读器实例
2015/07/25 Python
Python 递归函数详解及实例
2016/12/27 Python
python实现三种随机请求头方式
2021/01/05 Python
Laura Geller官网:美国彩妆品牌
2018/12/29 全球购物
办公室文秘自我鉴定
2013/09/21 职场文书
医学检验专业大学生求职信
2013/11/18 职场文书
省三好学生申请材料
2014/01/22 职场文书
公司业务员岗位职责
2014/03/18 职场文书
房产授权委托书范本
2014/09/22 职场文书
党的群众路线教育实践活动心得体会(企业)
2014/11/03 职场文书
2015年党员个人剖析材料
2014/12/18 职场文书
工作感想范文
2015/08/07 职场文书
如果用一句诗总结你的上半年,你会用哪句呢?
2019/07/16 职场文书
Mysql如何实现不存在则插入,存在则更新
2022/03/25 MySQL