JS에서 이미지 미리보기를 업로드하는 방법

이 기사에서는 JS의 이미지 미리보기를 업로드하는 방법에 대해 설명합니다. 참조를 위해 공유하십시오. 특정 구현 방법은 다음과 같습니다.

다음과 같이 코드를 복사하십시오 : 함수 previewimage (imgfile)

{{

var fileExtension = imgfile.value.substring (imgfile.value.lastindexof ( "."), imgfile.value.length);

fileExtension = fileExtension.TolowerCase ();

if ((fileExtension! = '. jpg') && (fileExtension! = '. gif') && (fileExtension! = '. jpeg') && (fileExtension! = '. png') && (fileExtension! = '. bmp')).

{{

ALERT ( "죄송합니다. 시스템은 표준 형식의 사진 만 지원합니다. 형식을 조정하고 다시 업로드하십시오. 감사합니다!");

imgfile.focus ();

}

또 다른

{{

var 경로;

if (document.all) // 즉

{{

imgfile.select ();

경로 = document.selection.createrange (). 텍스트;

document.getElementById ( "imgpReview"). innerHtml = "";

document.getElementById ( "imgpreview"). style.filter = "progid : dximagetransform.microsoft.alphaimageloader (enabled = 'true', sizizeMethod = 'scale', src =/" " + path +"/"); // 필터 효과

}

else // ff

{{

path = imgfile.files [0] .getasdataurl ();

document.getElementById ( "imgpreview"). innerHtml = "<img id = 'img1'width = '120px'height = '100px'src = '+path+"'/> ";

// document.getElementById ( "img1"). src = path;

}

}

}

라고 불리는:

다음과 같이 코드를 복사하십시오. 이미지 업로드 : <input type = "file"name = "file"

스타일 = "너비 : 200px; 높이 : 20px;" onchange = "previewimage (this)"id = "업로드" />

<div id = "imgpreview">

</div>

작동 효과는 아래 그림에 나와 있습니다.

이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.