>웹 프론트엔드 >JS 튜토리얼 >업로드된 이미지, 이미지 크기 확인, jquery_jquery 기반 이미지 미리보기 효과 코드

업로드된 이미지, 이미지 크기 확인, jquery_jquery 기반 이미지 미리보기 효과 코드

WBOY
WBOY원래의
2016-05-16 18:07:511164검색

jquery는 업로드된 이미지 및 이미지 크기 확인, 이미지 미리보기 효과 코드
업로드된 이미지 확인

코드 복사 코드는 다음과 같습니다.
*/
function submit_upload_picture(){
var file = $('file_c').value
if(!/.( gif|jpg |jpeg|png|gif|jpg|png)$/.test(file)){
alert("사진 형식은 .gif, jpeg, jpg, png 중 하나여야 합니다.")
} else{
$('both_form').action="file!upload.action"
$('both_form').submit()
$('insert_img').sethtml('< ;img src="http://images.anjiwu.com/images/loading.gif"/>')
$('display_div').setstyle('display', 'block'); >$ ('upload_div').setstyle('display', 'none');
}
}


이미지 유형 및 크기 확인

//예제 2
function verify_edit_logo(a ){
var file = $('file').value;
if(!/.(gif|jpg|jpeg|png|gif|jpg|png)$/.test(file)){
alert(" 이미지 유형은 .gif, jpeg, jpg, png 중 하나여야 합니다.")
if(a==1){
return false
}
}else{
var image = new image();
image.src = file;
var height = image.height;
var filesize = image.filesize; 🎜>$( 'beforeend').src=file;
$('div_regi_right').setstyle('display', 'block')
if(width>80 && height>80 && filesize>102400 ){
alert('80*80픽셀 이하의 이미지를 업로드하세요.')
if(a==1){
return false; 🎜>if(a ==1){
return true;
}
}
}



사진 미리보기




코드 복사
코드는 다음과 같습니다.
//예제 3function viewimg(index) { var name = 'uploadimg' index; var imgup = $(name); var imgpath = getpath(imgup);
var local = imgup.value; lastindexof(".");//업로드된 파일의 크기 결정
var img = document.createelement("img")
img.src =
var filesize; .filesize;
img.onload = function (){filesize=this.filesize;}
if(img.filesize>5242880){
alert("이미지 파일이 너무 큽니다! ");
return false;
}
//이미지 형식인지 확인
var imgname = imgup.value.substring(imgup.value.lastindexof("."), imgup. value.length);
imgname = imgname.tolowercase();
if ((imgname != ".jpg") && (imgname != ".gif") && (imgname != ".jpeg") && ( imgname != ".png") && (imgname != ".bmp")) {
alert("u8bf7u9009u62e9u56feu7247u6587u4ef6uff0cu8c22u8c22!")
imgup.focus()
//값 지우기 파일 www.3ppt.com
imgup.select();
document.selection.clear();
} else {
//이미지 표시
document.getelementbyid("sig_preview" 색인) .innerhtml = "";
}
if (index >=3){
var cnt = index 1;
$("img" cnt). style.display = "";
}
}

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.