如何在javascript中获取html输入文件类型属性?

时间:2012-12-28 06:26:12

标签: php javascript jquery html ajax

我想在javascript中捕获上传文件属性数组。这可以用javascript做吗?

细节要求:  我有html表单,由javascript函数提交,现在我想在该表单中再添加一个字段上传文件但是如何通过上传文件数组来发送我的 php脚本 javascript功能

$('#save').click(function(){        
    var filearray = new Array();
    var file = $("#file")[0].files[0];
    filearray["filename"] = file.name;
    filearray["filesize"] = file.size;
    filearray["fileType"] = file.type;
    filearray["fileTemp"] = file.tmp_name;
    filearray["fileError"] = file.error;
});

我在javascript中没有获取属性 tmp_name 错误,因为它在文件位于服务器上时生成,但我在客户端执行此操作。

4 个答案:

答案 0 :(得分:2)

文件在服务器上时生成的文件属性 tmp_name 错误

答案 1 :(得分:0)

尝试这样的事情

var extension = new Array(".jpg",".jpeg",".JPEG",".JPG",".PNG",".png",".ico",".ICO",".GIF",".gif");

function CheckExtension(fieldvalue)
{
        var thisext = fieldvalue.substr(fieldvalue.lastIndexOf('.'));
    for(var i = 0; i < extension.length; i++) {
        if(thisext == extension[i]) { return true; }
        }

    return false;

}

将fieldvalue作为输入文件值传递。

希望这可以帮到你..

答案 2 :(得分:0)

获取文件名和扩展名:

var extension = fileName.split('.').pop();
var name = fileName.split('.')[0];

获取文件大小:

$('#youfiletextbox').bind('change', function() {
  var fileSize = this.files[0].size);
});

答案 3 :(得分:0)

  <input type="file" class='img-icon' id="qImage" name="qImage1" accept="image/*" onchange="GetFileInfo('qImage')"/>  
function GetFileInfo(imageID) {
        var fileInput = document.getElementById(imageID);
        var fName;
        var fSize;
        var fType;

        var message = "";
        if ('files' in fileInput) {
            if (fileInput.files.length == 0) {
                alert("Please browse for one or more files.");
            } else {
                for (var i = 0; i < fileInput.files.length; i++) {
                    var file = fileInput.files[i];
                    if ('name' in file) {
                        fName = file.name;
                    }
                    else {
                        fName = file.fileName;
                    }
                    if ('size' in file) {
                        fSize = file.size;
                    }
                    else {
                        fSize = file.fileSize;
                    }
                    if ('type' in file) {
                        fType = file.type;
                    }
                    else {
                        fType = file.mediaType;
                    }
                }

                var extension = fName.split('.').pop();
                var size = fSize / 1024;

                if(extension == "png" || extension == "jpg" || extension == "svg"){
                    if(size > 5){
                        alert("Image size must be less than 5kb.");
                        document.getElementById(imageID).value = null;
                    }
                } else {
                    alert("Image type must png, jpg or svg and size must be less than 5kb.");
                    document.getElementById(imageID).value = null;
                } 


            }
        } 
        else {
            if (fileInput.value == "") {
                message += "Please browse for one or more files.";
                message += "<br />Use the Control or Shift key for multiple selection.";
            }
            else {
                message += "Your browser doesn't support the files property!";
                message += "<br />The path of the selected file: " + fileInput.value;
            }
            document.getElementById ("info").innerHTML = message;
        }
    }
<div id="info" style="margin-top:20px"></div>