form表单无刷新上传文件

很多时候，我们上传完文件之后，不想当前页面跳转，或者是刷新一下。那么我们需要怎么做呢？ 

首先，我们用的是最简单的form表单上传，提交方式。代码如下

<form id="uploadForm" class="picForm" action="uploadBackImgAction.action"
   method="post" enctype="multipart/form-data" target="framFile"   
   onsubmit="return check();">  
    <input name="image" id="uploadImage" onchange="input.value=this.value"
       style="width:260px;   height:30px;" type="file" value="选择图片"/>
    <input id="input" style="width:260pt;height:30pt;"/>
    <input type="submit" value="上传"/>
form>

注意： enctype=”multipart/form-data” 必须不能变
           target=”framFile”

<iframe id="framFile" name="framFile" style="display:none;">iframe>

onsubmit 的作用是提交表单前进行验证。

//验证图片类型、大小、是否为空
function check(){
    var maxSize = 2*1024*1024;  //2M 
    var img = document.getElementById("uploadImage");

    if(img.value == "" || img.value == undefined || img.value == null){
        alert("请选择文件!");
        return false;
    }else if (!/\.(gif|jpg|jpeg|png|GIF|JPG|JPEF|PNG)$/.test(img.value)){
        alert("图片类型必须为gif|jpg|jpeg|png中的一种!");
        return false;
    }else if(img.files[0].size > maxSize){
        alert("上传图片不能超过2M !");
        return false;
    }
}