第一步：先引入jQuery与ajaxFileUpload插件。注意先后顺序，ajaxFileUpload插件依赖jquery

<script src="${base}/mobile/js/jquery-1.7.1.js" type="text/javascript"></script>
<script src="${base}/mobile/js/ajaxfileupload.js" type="text/javascript"></script>

第二步：test.html（省略无关项）

<script src="jquery-1.7.1.js" type="text/javascript"></script>

    <script src="ajaxfileupload.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

            $(":button").click(function () {

                ajaxFileUpload();

            })

        })

        function ajaxFileUpload() {            $.ajaxFileUpload

            (

                {

                    url: 'upload.jspx', //用于文件上传的服务器端请求地址

                    secureuri: false, //是否需要安全协议，一般设置为false

                    fileElementId: 'fileVideo', //文件上传域的ID

                    dataType: 'json', //返回值类型 一般设置为json

                    success: function (data, status)  //服务器成功响应处理函数

                    {

                        $("#imgSuccess").attr("src", data.imgurl);

                        if (typeof (data.error) != 'undefined') {

                            if (data.error != '') {

                                alert(data.error);

                            } else {

                                alert(data.msg);

                            }

                        }

                    },

                    error: function (data, status, e)//服务器响应失败处理函数

                    {

                        alert(e);

                    }

                }

            )

            return false;

        }

</script>
<body>

    <p><input type="file" id="fileVideo" name="file" /></p>    <input type="button" value="上传" />

    <p><img id="imgSuccess" alt="上传成功啦" src="" /></p>

</body>

第三步：java（我这里是上传到其他平台的接口，不用做参考）

@requestMapping("/upload.jspx")

public String upload(@RequestParam(required=false) MultipartFile file,HttpServletRequest request){
        String message = null;
        if(file.isEmpty()){
            return null;
        }
        String originalFilename = file.getOriginalFilename();
        String realName = request.getSession().getServletContext().getRealPath(file.getOriginalFilename());
        int i = realName.indexOf(originalFilename);
        String dir = realName.substring(0, i);
        File f = new File(dir,originalFilename);
        if(!f.exists()){
            f.mkdirs();
        }
        try {
            file.transferTo(f);
            String actionUrl = PropertyUtils.getPropertyValue(new File(realPathResolver.get(Constants.XXXXX)), BACK_UPLOAD);
            String returnUrl = com.fire.back.utils.UploadUtils.SubmitPost(actionUrl, originalFilename, "", dir);
            return returnUrl;
        } catch (Exception e) {
            message = "上传录音出错";
            log.error(message,e);
            return null;
        }  
    }

基于jquery的jqueryeasyui（类似于extjs）学习资料http://pan.baidu.com/s/1o8Koj9K

160616、jQuery插件之ajaxFileUpload及jqueryeasyui学习资料分享的更多相关文章

  1. [转]Android 学习资料分享（2015 版）

    转 Android 学习资料分享(2015 版) 原文地址:http://www.jianshu.com/p/874ff12a4c01 目录[-] 我是如何自学Android,资料分享(2015 版) ...

  2. jQuery插件之ajaxFileUpload异步上传

    介绍 AjaxFileUpload.js 是一个异步上传文件的jQuery插件,原理是创建隐藏的表单和iframe然后用JS去提交,获得返回值. 下载地址: http://files.cnblogs. ...

  3. jQuery插件之ajaxFileUpload

    原文:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html ajaxFileUpload是一个异步上传文件的jQuery插件 ...

  4. 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload

    http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...

  5. jQuery插件之ajaxFileUpload 2

      ajaxFileUpload.js 很多同名的,因为做出来一个很容易. 我用的是这个:https://github.com/carlcarl/AjaxFileUpload 下载地址在这里:http ...

  6. ASP.NET- 无刷新上传使用jQuery插件之ajaxFileUpload

    灰常好,我已经使用过里面的代码了,可以用,原文地址:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFil ...

  7. jQuery插件之ajaxFileUpload[转载]

    ajaxFileUpload.js 很多同名的,因为做出来一个很容易. 我用的是这个:https://github.com/carlcarl/AjaxFileUpload 下载地址在这里:http:/ ...

  8. 【转】jQuery插件之ajaxFileUpload

    转自:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 说在前头,本文出自上面的作者,只是以前存的一些网址不见了,怕以后 ...

  9. jQuery插件之ajaxFileUpload API文档

    ajaxFileUpload是一个异步上传文件的jQuery插件. 语法:$.ajaxFileUpload([options]) options参数说明: 1.url  上传处理程序地址. 2,fil ...

随机推荐

  1. atitit.loading的设计与实现控件选型attilax 总结

    atitit.loading的设计与实现控件选型attilax 总结 1. Percentage Loader(推荐) 1 1.1. 起始百分比::调整  progress 1 2. CSS3 Loa ...

  2. gdb前端: VIM+Pyclewn 调试C/C++

    (gdb) mapkeys C-B : break "${fname}":${lnum} # set breakpoint at current line C-D : down C ...

  3. js生成二维码的jquery组件–qrcode

    js生成二维码的jquery组件–qrcode 2015/01/30 / 2508 VIEWS / JAVASCRIPT, JQUERY 有一些耗cpu的计算,完全可以在客户端上计算,比如生成二维码. ...

  4. -[__NSArrayI removeAllObjects]: unrecognized selector sent to instance 0x7fa8dc830110

    问题 今天做项目,遇到了这个问题 -[__NSArrayI removeAllObjects]: unrecognized selector sent to instance 0x7fa8dc8301 ...

  5. private继承的作用

    这里有个demo,里面的Stack<T*> : private Stack<void *>,作者对此的解释如下 The partial specialization for o ...

  6. dp之多重背包hdu1059

    题意:价值为1,2,3,4,5,6. 分别有n[1],n[2],n[3],n[4],n[5],n[6]个.求能否找到满足价值刚好是所有的一半的方案. 思路:简单的多重背包,我建议多重背包都用二进制拆分 ...

  7. 配置ubuntu - tftp server服务器步骤

    配置Ubuntu tftp服务的步骤: 1.安装相关软件包:Ubuntu tftp(服务端),tftp(客户端),xinetd sudo apt-get install tftpd tftp xine ...

  8. RabbitMQ之远程过程调用（RPC）【译】

    在第二个教程中,我们学习了如何使用工作队列在多个worker之间分配耗时的任务. 但是如果我们需要在远程计算机上运行功能并等待结果呢?嗯,这是另外一件事情,这种模式通常被称为远程过程调用(RPC). ...

  9. 实战c++中的vector系列--知道emplace_back为何优于push_back吗？

    上一篇博客说道vector中放入struct.我们先构造一个struct对象.再push_back. 那段代码中,之所以不能使用emplace_back,就是由于我们定义的struct没有显示的构造函 ...

  10. SSIS 自测题-控制流控件类

    说明:以下是自己的理解答案,不是标准的答案,如有不妥烦请指出.         有些题目暂时没有答案,有知道的请留言,互相学习,一起进步. 62.描述一下 Execute SQL Task 的作用,在 ...