js批量上傳
① 我需要一個js或者jquery能批量上傳圖片+預覽的功能。急~~~急~~~急~~
WebUploader項目,符合你的要求。
//文件上傳過程中創建進度條實時顯示。
uploader.on('uploadProgress',function(file,percentage){
var$li=$('#'+file.id),
$percent=$li.find('.progressspan');
//避免重復創建
if(!$percent.length){
$percent=$('<pclass="progress"><span></span></p>')
.appendTo($li)
.find('span');
}
$percent.css('width',percentage*100+'%');
});
//文件上傳成功,給item添加成功class,用樣式標記上傳成功。
uploader.on('uploadSuccess',function(file){
$('#'+file.id).addClass('upload-state-done');
});
//文件上傳失敗,顯示上傳出錯。
uploader.on('uploadError',function(file){
var$li=$('#'+file.id),
$error=$li.find('div.error');
//避免重復創建
if(!$error.length){
$error=$('<divclass="error"></div>').appendTo($li);
}
$error.text('上傳失敗');
});
//完成上傳完了,成功或者失敗,先刪除進度條。
uploader.on('uploadComplete',function(file){
$('#'+file.id).find('.progress').remove();
});
更多細節,請查看js源碼。
② .net 如何上傳整個文件夾的文件
如果要實現整個文件夾的上傳, 有兩種方式:
使用支持文件夾上傳的插件.
.NET你可以用servlet; 或者Flesh. 其中 chrome瀏覽器支持使用javascript上傳文件夾文件手動將文件夾中的所有文件,利用<input type="file" />控制項添加到頁面, 一次性提交上傳. 其中支持html5的瀏覽器大部分可使用<input type="file" multiple="multiple" />一次選擇多文件上傳(IE9除外)
③ 怎麼獲取bootstrap批量上傳的file
所需css\js包,自尋尋找
bootstrap.css
fileinput.css
fileinput.min.js
fileinput_locale_zh.min.js //漢化包
註:bootstrap的css影響圖標顯示,最好引用CDN上的:http://www.bootcdn.cn/,先關插件都可以在裡面找。
_________________________________________________________________________________________
部分屬性
可在<input ..>中直接添加的屬性
data-show-preview true|false //選擇文件後是否顯示圖片
data-show-upload true|false //是否顯示組件中的上傳按鈕,鑒於需要同步上傳,可以選擇設置為fals
multiple //,用於支持多選,可以通過js配置控制數量限制
readonly true|false //為看出什麼實際作用,true,false沒區別data-allowed-file-extensions ["csv","txt"] //限制 上傳的文件類型,類型不符合會有提示
_________________________________________________________________________________________________________
在js中的配置屬性$("#ID").fileinput({});
language zh //設置語言包,zh代表大陸漢化包,其他地區請另外下載js
maxFileCount int //多選情況,數量的限制屬性,超過限制會有提示
showUpload true|false //是否顯示上傳按鈕,與date-show-upload一致 <code class="language-js hljs has-numbering">allowedPreviewTypes ['image'] //允許選擇文件後顯示縮圖的文件類型
</code><pre name="code" class="prettyprint"><code class="language-js hljs has-numbering">maxFileSize 20000 //最大上傳限制,單位kb</code>
更多請看官方文檔。。。。。。