HTML Javascript文件上传

Question

我有以下HTML对象和文件

  <form name='file_form' class="panel-body">
    <input type="file" id="file" name="file[]" />
    <input type='button' id='btnSendFile' value='sendFile' />
    <output id="list"></output>
  </form>

使用type =“ file”中的文件浏览的地方，我选择一个要上传的文件。 当我单击btnSendFile时，所选文件的文件名将显示在name下。 但是，当我在下面传递它时，文件变量为null。 我需要访问文件对象的文件对象属性。

我有一个发送文件的功能。

var file ;

function sendFile(file) {
var to = $('#to').get(0).value;
var filename = file.name;
var filesize = file.size;
var mime = file.type;

}

$('#btnSendFile').bind('click', function() {
 sendFile(file);
});

如何在javascript中需要file.name，file.size和file.type的文件对象中获取文件？ 我应该分配什么变量文件？

更新： 答案：

file= $("#file")[0].files[0];

Answer 1

将this.previousElementSibling.files[0]或$("#file")[0].files[0]传递给sendFile

 // var file; function sendFile(file) { // var to = $('#to').get(0).value; var filename = file.name; var filesize = file.size; var mime = file.type; $("#list").html(filename + " " + filesize + " " + mime) } $("#btnSendFile").bind("click", function() { sendFile(this.previousElementSibling.files[0]); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <form name='file_form' class="panel-body"> <input type="file" id="file" name="file[]" /> <input type='button' id='btnSendFile' value='sendFile' /> <output id="list"></output> </form> 

Answer 2

你好，这是你的答案

 <form name='file_form' class="panel-body">
        <input type="file" id="file" name="file[]"/>
        <input type='button' id='btnSendFile' value='sendFile' onclick="myFunction()" />
        <output id="list"></output>
      </form>

    <script>
    function myFunction(){
        var x = document.getElementById("file");
    var txt = "";

                var file = x.files[0];
                if ('name' in file) {
                    txt += "name: " + file.name + "<br>";
                }
                if ('size' in file) {
                    txt += "size: " + file.size + " bytes <br>";
                }
    document.getElementById ("list").innerHTML = txt;
    }
    </script>