ファイル API についてはここでは詳しく説明しません。ここでは、ファイル ハンドルを使用して、FileReader インターフェイスを介して非同期的に読み込みます。ファイルの内容をメモリに格納し、それを js 変数に割り当てます。
function getImgSrc(ターゲット, コールバック) {
If (window.FileReader) {
var oPreviewImg = null, oFReader = new window.FileReader();
oFReader.onload = 関数 (oFREvent) {
oPreviewImg = 新しい画像();
var type = target.files[0].type.split("/")[1];
var src = oFREvent.target.result;
oPreviewImg.src = src;
If (コールバックの種類 == "関数") {
callback(oPreviewImg, target, type, src);
}
return oPreviewImg.src;
};
return (function () {
var aFiles = target.files;
if (aFiles.length === 0) {
return;
}
If (!IsImgType(aFiles[0].type)) {
alert("有効な画像ファイルを選択する必要があります!");
return;
}
If (aFiles[0].size > 1024 * 1024) {
target.value = "";
alert('アップロードする画像ファイルのサイズは 1M 未満にしてください。');
return;
}
oFReader.readAsDataURL(aFiles[0]);
})();
}
If (navigator.appName === "Microsoft Internet Explorer") {
return (function () {
document.getElementById("imagePreview").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = target.value;
})();
}
}
上記は、javascript と fileReader を組み合わせて画像をアップロードするためのキーコードです。