jQuery File Upload 多文件 单击选中或多选文件直接自动上载 无需提交按钮

jQuery-File-Upload

插件地址：https://github.com/blueimp/jQuery-File-Upload

HTML，激活 fileupload 按钮，你可以用  CSS 绘制你喜欢的效果

<button onclick="$('#fileupload').click();">select file ...</button>

HTML，页码上放置一个文件选择类型的控件，隐藏形式(display: none)，如果服务端是 struts2，那么 name="upload" 很重要，如果是 servlet 或其它则无所谓。

<input id="fileupload" type="file" name="upload" multiple style='display: none'>

javascript

    $('#fileuploadCompanyLogo').fileupload(    {      url : 'struts/image/UploadFile',      type : 'post',      dataType : 'json',      autoUpload : true,      formData : [      {} ],      done : function(e, data)      {        console.debug(data.result);        //        var object = JSON.parse(data.result);        var image = new Image(object.image.id, object.image.assetId, object.image.assetXml, object.image.url, object.image.type);        console.log('image formUploadFileUser success,' + image);      },      progressall : function(e, data)      {        var progress = parseInt(data.loaded / data.total * 100, 10);        console.log(progress + '%', data.loaded, data.total);      },      fail : function(e, data)      {        console.log('fileupload, fail', e, data);      }    }).prop('disabled', !$.support.fileInput).parent().addClass($.support.fileInput ? undefined : 'disabled');

https://github.com/blueimp/jQuery-File-Upload

这里还有更多的例子与相应的文档介绍。