第一步:下载Ueditor1.4.3
下载之后重命名为ueditor ,并放到项目的public
目录下
第二步:引入
在视图文件里引入一下js文件
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>//也可以引用本地的
<js file="__ROOT__/Public/Ueditor/ueditor.config.js"/>
<js file="__ROOT__/Public/Ueditor/ueditor.all.min.js"/>
<js file="__ROOT__/Public/Ueditor/lang/zh-cn/zh-cn.js"/>
<script type="text/javascript" charset="utf-8">
window.UEDITOR_HOME_URL = "__PUBLIC__/Ueditor/";
$(document).ready(function () {
UE.getEditor('info', {
initialFrameHeight: 500,
initialFrameWidth: 1100,
serverUrl: "{:U(MODULE_NAME.'/Index/save_info')}"
});
});
</script>
在需要编辑器的地方写入以下代码
<textarea name="info" id="info" style="width:1024px;height:500px;"></textarea>
第三步:控制器
在控制器中放入以下代码
public function save_info(){
$ueditor_config = json_decode(preg_replace("/\/\*[\s\S]+?\*\//", "", file_get_contents("./Public/Ueditor/php/config.json")), true);
$action = $_GET['action'];
switch ($action) {
case 'config':
$result = json_encode($ueditor_config);
break;
/* 上传图片 */
case 'uploadimage':
/* 上传涂鸦 */
case 'uploadscrawl':
/* 上传视频 */
case 'uploadvideo':
/* 上传文件 */
case 'uploadfile':
$upload = new \Think\Upload();
$upload->maxSize = 3145728;
$upload->rootPath = './Public/Uploads/';
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');
$info = $upload->upload();
if (!$info) {
$result = json_encode(array(
'state' => $upload->getError(),
));
} else {
$url = __ROOT__ . "/Public/Uploads/" . $info["upfile"]["savepath"] . $info["upfile"]['savename'];
$result = json_encode(array(
'url' => $url,
'title' => htmlspecialchars($_POST['pictitle'], ENT_QUOTES),
'original' => $info["upfile"]['name'],
'state' => 'SUCCESS'
));
}
break;
default:
$result = json_encode(array(
'state' => '请求地址出错'
));
break;
}
/* 输出结果 */
if (isset($_GET["callback"])) {
if (preg_match("/^[\w_]+$/", $_GET["callback"])) {
echo htmlspecialchars($_GET["callback"]) . '(' . $result . ')';
} else {
echo json_encode(array(
'state' => 'callback参数不合法'
));
}
} else {
echo $result;
}
}
注意:文件默认目录为"Public/Uploads",如果没有就自己创建,也可以自己修改。