关于simditor上传图片的问题

PHP中文网
发布: 2017-03-24 14:10:48
原创
3963人浏览过

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

初始化编辑器

<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)

1.png

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

2.png

打开simditor.js找到

return $input = $('<input type="file" title="' + Simditor._t('uploadImage') + '" accept="image/*">').appendTo($uploadItem);这一行,

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

艺帆CMS 莹白手机站源码
艺帆CMS 莹白手机站源码

漂亮的莹白风格手机网站 版本信息:艺帆CMS企业版V1.5 描述:全景大幻灯,蓝色 莹白设计作为主色调,大气简洁, 图片批量上传,全站伪静态,关键词可独立设置也可以按内置规 则自动设置关键词,免去你的SEO烦恼,做好外链和内容即可。 基于艺帆CMS企业版制作可和官方同步升级。

艺帆CMS 莹白手机站源码 115
查看详情 艺帆CMS 莹白手机站源码

如下:

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;
    }  
}
登录后复制

相关文章:

Simditor使用方法

javascript - simditor 上传图片大小有限制吗?

javascript - simditor 上传大图失败

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号