南下客

遇见更好的自己

Jq获取上传文件的名称类型及大小

上传多个文件需添加multiple属性:


<input id="fUpload" multiple type="file" />
<ul id="ulList">
</ul>
<input id="btnShow" type="button" value="显示上传文件的详细" />


先检测文件的数量通过循环来分别获取每个文件的详细信息:


$("#btnShow").on('click', function () {
    $("#ulList").empty();
    var fp = $("#fUpload");
    var lg = fp[0].files.length; // get length
    var items = fp[0].files;
    var fragment = "";
    if (lg > 0) {
        for (var i = 0; i < lg; i++) {
            var fileName = items[i].name; // get file name
            var fileSize = items[i].size; // get file size 
            var fileType = items[i].type; // get file type
 
            // append li to UL tag to display File info
            fragment += "<li>" + fileName + " (<b>" + fileSize + "</b> bytes) - Type :" + fileType + "</li>";
        }
        $("#ulList").append(fragment);
    }
});