Simditor图片上传
来源:互联网 发布:公司财务报表软件下载 编辑:程序博客网 时间:2024/05/17 05:03
初始化编辑器
- <script type="text/javascript">
- $(function(){
- toolbar = [ 'title', 'bold', 'italic', 'underline', 'strikethrough',
- 'color', '|', 'ol', 'ul', 'blockquote', 'code', 'table', '|',
- 'link', 'image', 'hr', '|', 'indent', 'outdent' ];
- var editor = new Simditor( {
- textarea : $('#editor'),
- placeholder : '这里输入内容...',
- toolbar : toolbar, //工具栏
- defaultImage : 'simditor-2.0.1/images/image.png', //编辑器插入图片时使用的默认图片
- upload : {
- url : 'ImgUpload.action', //文件上传的接口地址
- params: null, //键值对,指定文件上传接口的额外参数,上传的时候随文件一起提交
- fileKey: 'fileDataFileName', //服务器端获取文件数据的参数名
- connectionCount: 3,
- leaveConfirm: '正在上传文件'
- }
- });
- })
- </script>
upload默认为false,设置为true或者键值对就可以实现上传图片,界面是出来了,还需要进行后台编码(本例为Struts2)
实现功能之前需要修改一下simditor.js,我们可以对"本地图片" 用chrome审查元素发现没有name属性
打开simditor.js找到
return $input = $('<input type="file" title="' + Simditor._t('uploadImage') + '" accept="image/*">').appendTo($uploadItem);这一行,
可以搜索accept="image/*" 快速找到在input里加上 name="fileData"
如下:
- return _this.input = $('<input name="fileData" type="file" title="' + Simditor._t('uploadImage')
- + '" accept="image/*">').appendTo($uploadBtn);
同样继续搜索accept="image/*" 下面还有一个,加上name="fileData"
ImgUploadAction
- public class ImgUploadAction extends ActionSupport {
- private static final long serialVersionUID = 1L;
- private String err = "";
- private String msg; //返回信息
- private File fileData; //上传文件
- private String fileDataFileName; //文件名
- public String imgUpload() {
- //获取response、request对象
- ActionContext ac = ActionContext.getContext();
- HttpServletResponse response = (HttpServletResponse) ac.get(ServletActionContext.HTTP_RESPONSE);
- HttpServletRequest request = (HttpServletRequest) ac.get(ServletActionContext.HTTP_REQUEST);
- response.setContentType("text/html;charset=gbk");
- PrintWriter out = null;
- try {
- out = response.getWriter();
- } catch (IOException e1) {
- e1.printStackTrace();
- }
- String saveRealFilePath = ServletActionContext.getServletContext().getRealPath("/upload");
- File fileDir = new File(saveRealFilePath);
- if (!fileDir.exists()) { //如果不存在 则创建
- fileDir.mkdirs();
- }
- File savefile;
- savefile = new File(saveRealFilePath + "/" + fileDataFileName);
- try {
- FileUtils.copyFile(fileData, savefile);
- } catch (IOException e) {
- err = "错误"+e.getMessage();
- e.printStackTrace();
- }
- String file_Name = request.getContextPath() + "/upload/" + fileDataFileName;
- msg = "{\"success\":\"" + true + "\",\"file_path\":\"" + file_Name + "\"}";
- out.print(msg); //返回msg信息
- return null;
- }
- public String getErr() {
- return err;
- }
- public void setErr(String err) {
- this.err = err;
- }
- public String getMsg() {
- return msg;
- }
- public void setMsg(String msg) {
- this.msg = msg;
- }
- public File getFileData() {
- return fileData;
- }
- public void setFileData(File fileData) {
- this.fileData = fileData;
- }
- public String getFileDataFileName() {
- return fileDataFileName;
- }
- public void setFileDataFileName(String fileDataFileName) {
- this.fileDataFileName = fileDataFileName;
- }
- }
0 0
- Simditor图片上传
- Simditor图片上传
- Simditor图片上传
- Simditor编辑器 SpringMVC上传图片
- simditor 限制图片格式 和 上传图片过慢
- simditor编辑器,图片上传链接替换
- simditor 图片上传成功后修改图片地址
- Simditor上传图片(ASP.NET+JS/Jquery)
- Simditor的图片上传(原理 + django实现)
- react 中 使用 没有启用图片上传功能的simditor 富文本编辑器
- Simditor使用方法
- 又一HTML编辑器Simditor
- Simditor的使用
- 网页文档编辑器--simditor
- Simditor的快速使用
- 图片上传
- 上传图片
- 上传图片
- 2017 Wuhan University Programming Contest 现场赛 K.Wifi Relay(dijkstra)
- [学习笔记05] 正则
- 第一天
- iOS- NSThread/NSOperation/GCD 三种多线程技术的对比及实现
- leetcode 49(java)
- Simditor图片上传
- char short int long float double等字节大小基础信息
- linux系统的在学习
- 求S=a+aa+aaa+aaaa+...+aaaa..的值,a是个数字 * 例如:2+22+222+2222+22222(此时共有5个数相加), 几个数相加由键盘控制
- 操作系统的各种调度算法和自己碰到的一些疑问
- Linux的静态库和动态库
- 告别帖
- Statement与PreparedStatement的区别
- DELETE_FAILED_INTERNAL_ERROR Error while Installing APKs