Question

我正在尝试将事件列表器附加到文件输入。我以为它会像这样工作。但我在网上看过，似乎无法让它发挥作用。

    <input type="file" id=image1 >

    var image1 = document.getElementsByID("image1");

    image1.addEventListener('change', alert(1));

Answer 1

改变这个：

var image1 = document.getElementsByID("image1");
image1.addEventListener('change', alert(1));

到此：

var image1 = document.getElementById("image1");
image1.addEventListener('change', function(){ alert(image1); });

因为getElementsByID()不是有效的方法调用，但getElementById()是。

此外，您将执行一个调用alert()的函数，而不是立即调用alert并将alert的结果指定为click事件处理程序，我们需要将alert()包装在一个函数中。

最后，alert(1)没有显示任何内容，因为1不是变量，也不是字符串。你应该写alert(image1.someProperty)。由于image1是file类型，因此您可以访问与该元素关联的文件，然后访问特定文件，然后访问该文件的一个方面。

以下是整个事情：

var image1 = document.getElementById("image1");

image1.addEventListener('change', function(){ 
  var files = image1.files;
  alert(files[0].name); 
});

<input type="file" id=image1 >

Answer 2

试试这个：

＆＃13;

var input = document.getElementsByTagName('input')[0];

input.onclick = function () {
    this.value = null;
};

input.onchange = function () {
    alert(this.value);
};

＆＃13;

<input type='file' value='C:\fakepath' />

＆＃13;

Answer 3

<input type="file" id="image1" onchange="alert(1);" />

选择文件上的简单Javascript事件lister

3 个答案: