simditor 上传图片php,simditor富文本编辑器最新最简单的使用方法
Simditor這個編輯器就不過多的介紹了,反正我個人感覺挺不錯,界面好看并且使用起來也特別簡單。
一、Simditor下載
官網鏈接https://simditor.tower.im/,可以直接下載zip壓縮包或者通過git來下載。
二、引入文件
你下載的東西可能會非常多,但我們需要用到的有
把上面文件引入之后,我們就開始創建編輯器了
三、基本使用
寫html編輯器標簽
初始化編輯器js
$(function(){
var editor = new Simditor({
textarea: $('#editor'),
toolbar: [
'title', 'bold', 'italic', 'underline', 'strikethrough', 'fontScale',
'color', '|', 'ol', 'ul', 'blockquote', 'code', 'table', '|', 'link',
'image', 'hr', '|', 'alignment'
],
placeholder:'寫點什么呢......',
defaultImage:'images/image.png',//插入圖片顯示的默認圖片
params:{
'key':'v'
},//在textarea中插入一個隱藏的輸入以存儲參數
pasteImage:true,//是否允許直接粘貼圖片
cleanPaste:true,//自動刪除粘貼內容中的所有樣式
upload:{
url:'/api/api.php',//后臺接收圖片地址
params:null,
fileKey:'uploadFile',//后臺接收圖片需要
connectionCount:3,//允許同時上傳圖片數
leaveConfirm:'正在上傳圖片',//如果在上傳文件時離開頁面,則會顯示此消息;
}
});
});
如果不出意外的話,一個simditor編輯器已經出現了。
四、simditor上傳圖片
我們既然選擇了富文本編輯器,那么上傳圖片一定是必不可少的一個功能,那么我們來看看后臺應該怎么寫測試使用代碼<?php
$arr=[
'success'=>true,//true或false
'msg' => 'message',
'file_path'=> '/upload/1.png'
];
echo json_encode($arr);
使用測試代碼是想讓整個代碼先跑通,simditor對后臺返回的json格式要求就是上面那樣的,這有一點需要注意的是,不要使用return來返回數據要使用echo,至于為什么,這里不多解釋了。如果上面代碼你跑通了,那么接收上傳的圖片并且保存一定是你想要的,往下看,<?php
$image = $_FILES['uploadFile'];//對應初始化編輯器的fileKey
$path='../uploads/4.jpg';
if($image){
move_uploaded_file($image['tmp_name'], $path);
}
$arr=[
'success'=>true,
'msg' => $image,
'file_path'=> $path
];
echo json_encode($arr);
上面代碼只是簡單的把圖片保存到了$path這個路徑中了,至于上傳圖片重命名什么的就簡單了,自己動手試試吧。
總結
以上是生活随笔為你收集整理的simditor 上传图片php,simditor富文本编辑器最新最简单的使用方法的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 关于js继承
- 下一篇: 基于bat的自动网络重连配置脚本