php simditor 上传图片,关于simditor上传图片的问题

我们可自定义工具栏按钮使simditor实现更丰富和实现上传图片功能

初始化编辑器

$(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: '正在上传文件'

}

});

})

upload默认为false,设置为true或者键值对就可以实现上传图片,界面是出来了,还需要进行后台编码(本例为Struts2)

fe8a7063eae242b681a947641cffcc58.png

实现功能之前需要修改一下simditor.js,我们可以对"本地图片" 用chrome审查元素发现没有name属性

95845519c3fff0704ba8cf174f8a223a.png

打开simditor.js找到

return $input = $('').appendTo($uploadItem);这一行,

可以搜索accept="image/*" 快速找到在input里加上 name="fileData"

如下:return _this.input = $('').appendTo($uploadBtn);

同样继续搜索accept="image/*" 下面还有一个,加上name="fileData"

ImgUploadActionpublic 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;

}

}

相关文章:

本文原创发布php中文网,转载请注明出处,感谢您的尊重!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值