如何将文本编辑器嵌入框架
发布网友
发布时间：2022-04-29 15:54
共2个回答
热心网友
时间：2023-04-23 01:05
<link href="<?php echo base_url('/public/css/umeditor/umeditor.css'); ?>" type="text/css" rel="stylesheet">
<script type="text/javascript" src="<?php echo base_url('/public/js/jquery.min.js'); ?>"></script>
<script type="text/javascript" charset="utf-8" src="<?php echo base_url('/public/js/umeditor/umeditor.js'); ?>"></script>
<script type="text/javascript" charset="utf-8" src="<?php echo base_url('/public/js/umeditor/umeditor.config.js'); ?>"></script>
<script type="text/javascript" src="<?php echo base_url('/public/js/umeditor/zh-cn.js'); ?>"></script>
<link rel="stylesheet" href="<?php echo base_url('/public/css/umeditor/formbtn.css'); ?>">
引入相关PHP类：
在CI框架下的application\libraries中新建一个文件'Umupload.php'(我个人只是想用上传，所以变这么命名)
然后将图一中umeditor\php\Upload.class.php中的所以代码直接Copy至上一步新建的文件中。
处理上传：
这里本菜鸡直接在CI的默认控制器 welcome中写了两个function 分别加载编辑器视图和处理上传，如下：
load->view('umeditor.html');
}
public function umupload(){
error_reporting( E_ERROR | E_WARNING );
//上传配置
$config = array(
"savePath" => "upload/" , //存储文件夹 (感觉没啥用)
"maxSize" => 1000 ,
"allowFiles" => array( ".gif" , ".png" , ".jpg" , ".jpeg" , ".bmp" )
);
//上传文件目录
$Path = "upload/";
//背景保存在临时目录中
$config[ "savePath" ] = $Path;
$this->load->library('Umupload',array('fileField'=>'upfile', 'config' => $config));
$type = $_REQUEST['type'];
$callback=$_GET['callback'];
$info = $this->umupload->getFileInfo();
/**
* 返回数据
*/
if($callback) {
echo '<script>'.$callback.'('.json_encode($info).')</script>';
} else {
echo json_encode($info);
}
}
}
其中public function umupload()的函数体就是图一umeditor\php\imageUp.php中的内容，并且做了相关修改。
至此，编辑器已经全部嵌入框架，但是还需修改一些代码片段才可以正式使用。
后期加工,以下修改均指CI框架中的修改：
修改JS：CI\public\js\umeditor.config.js 第139行附近修改为：
//图片上传配置区
,imageUrl:URL+"../../../index.php/welcome/umupload" //图片上传提交地址
,imagePath:URL + "../../../" //图片修正地址，引用了fixedImagePath,如有特殊需求，可自行配置
,imageFieldName:"upfile" //图片数据的key,若此处修改，需要在后台对应文件修改对应参数
这里主要是修改路径，让JS可以找到控制器。出于仓促这里使用相对路径。
修改PHP：
据上文所述，在welcome的控制器中 public function umupload()的函数体是copy而来，所以要修改一部分使之可以在CI中'跑'起来。修改之后的代码如上文所示，具体修改为：
删除最开始的两行：
header("Content-Type:text/html;charset=utf-8");
error_reporting( E_ERROR | E_WARNING );
将原编辑器中的 17行
$up = new Uploader( "upfile" , $config );
修改为：
$this->load->library('Umupload',array('fileField'=>'upfile', 'config' => $config));
因为此处通过加载library的方式引入编辑器的相关PHP类。并且library的构造函数只能传一个参数，因此做此修改。
第21行附近的
$info = $up->getFileInfo();
修改为：
$info = $this->umupload->getFileInfo();
热心网友
时间：2023-04-23 01:05
