控えめなJavaScriptでHTML5 File APIを使用するには？

控えめなJavaScriptでHTML5 File APIを使用したいと思います。しかし、私はHTMLからJavaScript関数を呼び出すことによってのみ動作させることができます。控えめなJavaScriptでFile APIを使用する方法はありますか？控えめなJavaScriptでHTML5 File APIを使用するには？

ファイルAPIはすべてのブラウザでサポートされていませんが、Google ChromeとFirefoxでこれを試しました。ドキュメントから

この作品：

<input type="file" id="input" onchange="handleFiles(this.files)">

そして私は動作しません。この控えめなJavaScriptで試してみました：

window.onload = function() { 
    var input2 = document.getElementById('input2'); 
    input2.addEventListener('onchange', handleFiles); 
}

完全な例は以下で、かつjsFiddleにテスト可能。

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"/> 
<script> 
window.onload = function() { 
    var input2 = document.getElementById('input2'); 
    input2.addEventListener('onchange', handleFiles); 
} 

function handleFiles(e) { 
    alert('got files'); 
} 
</script> 
</head> 
<body> 
<h1>Test</h1> 
<input type="file" id="input1" onchange="handleFiles(this.files)"/> 
<input type="file" id="input2"/> 
</body> 
</html>

出典

2011-07-21 Jonas

試してください：あなたは `いうし` true`にfalse`のをuseCaptureを設定しないのはなぜ

window.onload = function() { 
    var input2 = document.getElementById('input2'); 
    input2.addEventListener('change', handleFiles,false); 
    //      ^not onchange  ^older firefox needs this 
}

jsfiddle here

出典

2011-07-21 11:22:20 KooiInc

？ – Raynos

@レイノス：特に理由はありません。デフォルトはfalseです、私はそれを変更します。しかし、いくつかのブラウザではオプションではありません（note @ https://developer.mozilla.org/en/DOM/element.addEventListenerを参照）ので、値を指定すると便利です。 – KooiInc

ONCHANGEないけど

input2.addEventListener('change', handleFiles);

出典

2011-07-21 11:22:40

控えめなJavaScriptでHTML5 File APIを使用するには？

答えて

関連する問題