检测用户何时使用文件输入选择文件

时间:2010-07-10 10:40:58

标签: javascript jquery html-input

如何检测用户何时使用html文件输入选择要上载的文件。这样我就可以自动提交表格了。

3 个答案:

答案 0 :(得分:13)

文件上传元素在其内容发生更改时触发onchange事件。这是一个非常简洁的例子:

<input type="file" name="whatever" onchange="alert('Changed!');" />

编辑:哦,如果您想在选择内容时提交表单(虽然这可能会让您的用户感到有些困惑):

<input type="file" name="whatever" onchange="this.form.submit();" />

答案 1 :(得分:9)

$('#inputfileID').change(function(){
alert(0);
})​

答案 2 :(得分:3)

一种用于检测文件输入更改的原始JavaScript方法:

var fileInput = document.getElementById('inputfileID')
fileInput.addEventListener('change', function () {
  // Called when files change. You can for example:
  // - Access the selected files
  var singleFile = fileInput.files[0]
  // - Submit the form
  var formEl = document.getElementById('formID')
  formEl.submit()
}, false);

只需提及:属性false表示不使用捕获,即false表示DOM树中相关的change侦听器以自底向上的顺序执行。这是默认值,但是您应该始终赋予该属性以最大程度地实现兼容性。

另请参见a SO answer about change eventMDN docs for addEventListenera SO answer about form submission