ここでは、ファイルAPIについて詳しく説明しません。自分の世話をしましょう。来たら、ファイルハンドルを使用してファイルコンテンツを読み取る必要があります。これは、FileReaderを通じて達成されます。 FileReaderインターフェイスを介して、ファイルコンテンツを非同期にメモリにロードし、特定のJS変数を割り当てることができます。
コードコピーは次のとおりです。
関数getimgsrc(ターゲット、コールバック){
if(window.filereader){
var opreviewimg = null、ofreader = new window.filereader();
ofreader.onload = function(ofrevent){
opreviewimg = new Image();
var type = target.files [0] .type.split( "/")[1];
var src = ofrevent.target.result;
opreviewimg.src = src;
if(typeof callback == "function"){
callback(opreviewimg、ターゲット、タイプ、src);
}
OpReviewimg.srcを返します。
};
return(function(){
var afiles = target.files;
if(afiles.length === 0){
戻る;
}
if(!isimgtype(afiles [0] .type)){
alert( "有効な画像ファイルを選択する必要があります!");
戻る;
}
if(afiles [0] .size> 1024 * 1024){
Target.Value = "";
アラート( '1m未満の画像ファイルサイズをアップロードしてください。');
戻る;
}
ofreader.readasdataurl(afiles [0]);
})();
}
if(navigator.appname === "Microsoft Internet Explorer"){
return(function(){
document.getElementById( "ImagePreview")。filters.item( "dxmingagetransform.microsoft.alphaimageloader")。src = target.value;
})();
}
}
上記は、JavaScriptとFileReaderを組み合わせた画像をアップロードするための重要なコードです。あなたはそれが好きですか?