jquery实现文件异步上传

前言

     这里用了2个JS插件，一个是Jquery原生js，我的版本是jquery-1.7.2.min.js，另一个是jquery.form.js。这个form.js 是关键，不可少哦。另外， 

     我的服务器端用的是Play Framework,版本是2.1。下面是代码部分，贴出的是关键部分：

1.前端代码

html:

<form id="form1" method="POST" action="/image/upload" ENCTYPE="multipart/form-data">

　　<input id="uploadFile" type="file" name="myfile" />

</from> 

Javascript:

$("#uploadFile").change(function(){

        var message = "t";

        $("#form1").ajaxSubmit({

            method : "POST",

            success : function(data){

                 //成功
　　　　　　　　
　　　　　　　 if(data == "ok"){

　　　　　　　　　　alert("上传成功")

　　　　　　　　}else{
　　　　　　　　　　alert("上传失败");
　　　　　　　　}

            },

            error : function(){

                 alert("网络错误，请稍后重新尝试！");

            }

        });

    });

2.服务端代码

    public static void upload(File myfile){
 

        String msg = "fail";

        try{

            //图片写入路径,此处我的位置是项目的根目录

            File temp = new File(myfile.getName());

            //输入文件流

            FileInputStream input = new FileInputStream(myfile);

            //输出文件流

            FileOutputStream out = new FileOutputStream(temp);

            

            //每次写入的字节的大小

            byte [] b = new byte[1024];

            //文件长度

            int n;

            

            while((n=input.read(b)) != -1){

                //写入字节

                out.write(b, 0, n);

            }

            

            input.close();

            out.flush();

            out.close();

            msg = "ok";

        }catch(Exception e){

            Logger.error("Image.upload()", e.getMessage());

        }        

        renderJSON(msg);

    }