javascrip 클라이언트는 파일 크기와 파일 유형을 확인하고 upload_form 효과를 재설정합니다.

다음은 제가 작성한 일반적인 자바스크립트 스크립트입니다. 호출 시 할당해야 할 매개변수가 많지만 실제로는 모두 실제 요구사항에 필요합니다. 참고하셔서 필요한 스크립트로 변경하시면 됩니다.

코드 복사 코드는 다음과 같습니다.

/*****missionOtherAttEdit.jsp의 zhaogw 참조로 파일 정보 편집 가져오기*****/
/*file: input type="file" 객체, 일반적으로 이것을 사용합니다.
vType: 파일의 파일 형식 정보를 기록하는 데 사용되는 개체 이름입니다. 일반적으로 입력 개체입니다.
DivType: Div 개체의 이름입니다. innerHTML 콘텐츠를 사용하여 파일 형식 정보를 표시합니다.
vFile: 파일의 파일명 정보를 기록하는데 사용되는 객체명. 일반적으로 입력 개체입니다.
DivFile: Div 개체의 이름입니다. 해당 innerHTML 콘텐츠를 사용하여 파일의 파일 이름 정보를 표시합니다.
vSize, DivSize는 위와 유사하지만 파일의 크기 정보만 기록합니다.
mMaxSize: 업로드할 수 있는 최대 파일 크기를 m 단위로 계산합니다.
allowType: 허용되는 파일 형식만
*/
function getFileInfo(file,mMaxSize,allowType,vFile,DivFile,vType,DivType,vSize,DivSize){
var filePath = file.value; /파일 경로
var fileName;//파일 이름
var fileType;//파일 유형
var tmpObj;//임시 개체
var notAllowType=new Array("exe","bat" , "asp","jsp","js","dll");
var mHTML=document.getElementById(file.name 'Td').innerHTML
/*
var mHTML=" < ;input type='file' name='"
file.name "' class='input100' id='" file.id
"' Tip='빈 파일을 업로드할 수 없습니다.' contentEditable='false' tmt:required='true' focusTips='파일 이름을 입력하세요' onChange='getFileInfo(this,"
mMaxSize ","" allowedType "","" vFile "","" DivFile "","" vType "","" DivType "","" vSize "","" DivSize "")'>";
*/
// 경고(mHTML);
//파일 이름 가져오기
if(filePath != null && filePath != ''){
var pass=true;
//파일 유형
fileType = filePath.substring(filePath.lastIndexOf('.') 1 , filePath.length);
if (fileType!=null&&fileType!='')
{
for (var i in notAllowType){
if (fileType.toLowerCase()==notAllowType[i ] ){
pass=false;
break;}
}
}
//허용되는 유형, 비어 있으면 허용되는 유형이 설정되지 않습니다.
var match=false ;
if (allowType!=null&&allowType!=''){
var allowedList=allowType.split('|')
for (var j inallowList){
if (fileType.toLowerCase ()==allowList[j].toLowerCase()){
match=true;
break;}
}
} else {match=true;}
if (pass&&match)
{
fileName = filePath.substring(filePath.lastIndexOf('\') 1,filePath.length)
tmpObj=document.getElementById(vType)
if (tmpObj!=null)
tmpObj.value = fileType;
tmpObj=document.getElementById(DivType);
if (tmpObj!=null)
tmpObj.innerHTML =
tmpObj=document.getElementById(vFile) ;
if (tmpObj!=null)
tmpObj.value = fileName;
tmpObj=document.getElementById(DivFile)
if (tmpObj!=null)
tmpObj.innerHTML = 파일 이름 ;
try{
var fso,f,s;
fso = new ActiveXObject("Scripting.FileSystemObject")
f = fso.GetFile(file.value); f.Size > ; mMaxSize*1048576){
alert("파일 크기는 초과할 수 없습니다." mMaxSize "M")
document.getElementById(file.name 'Td').innerHTML =
tmpObj; =document.getElementById(vType);
if(tmpObj!=null)
tmpObj.value = '';
tmpObj=document.getElementById(DivType)
if(tmpObj!=null)
tmpObj .innerHTML = '';
tmpObj=document.getElementById(vFile);
if (tmpObj!=null)
tmpObj.value = ''; (DivFile);
if (tmpObj!=null)
tmpObj.innerHTML = '';
tmpObj=document.getElementById(vSize)
if (tmpObj!=null)
tmpObj .value = ' ';
tmpObj=document.getElementById(DivSize);
if (tmpObj!=null)
tmpObj.innerHTML =
return; else
{
tmpObj=document.getElementById(vSize);
if (tmpObj!=null)
tmpObj.value = f.Size
tmpObj=document.getElementById(DivSize);
if (tmpObj!=null)
tmpObj.innerHTML = f.Size " 바이트(바이트)"
var imgType=new Array("jpg","jpeg","gif","bmp ");
var isImg=false;
//파일 유형
if (fileType!=null&&fileType!='')
{
for (var k in imgType){
if (fileType .toLowerCase()==imgType[k]){
isImg=true;
break;}
}
}
var tmpObj=document.getElementById("imgView") ;
if (isImg&&tmpObj){
var y = document.getElementById(file.name "img")
if(y){
y.src = "file://localhost/" file.value ;
}else{
var img=document.createElement("img");
img.setAttribute("src","file://localhost/" file.value); 🎜>img .setAttribute("width","120");
img.setAttribute("height","90")
img.setAttribute("id",file.name "img");
tmpObj.appendChild(img)
}
}}
}catch(e){
//무시
}
}
else if (!pass ) {alert("업로드가 허용되지 않는 파일 형식: " fileType);document.getElementById(file.name 'Td').innerHTML = mHTML;}
else if (!match) {alert("Only 파일 형식을 업로드할 수 있습니다:" "allowType);document.getElementById(file.name 'Td').innerHTML = mHTML;}
}
}


호출 방법 코드:

코드 복사 코드는 다음과 같습니다.

< ;td width ="23%" class="inputTd" id="fileNameTd" colspan="3">

표시 필요 현재 업로드된 이미지 다음 코드를 추가하세요:

스크립트의 관련 규칙을 간략하게 설명하세요:

1: 필요한 경우 Object(또는 input type="file" 개체를 포함하는 innerHTML 속성이 있는 다른 개체, 이름은 접미사로 입력 이름 속성 "Td"여야 함)를 사용합니다.
2: imgView는 더 많은 매개변수를 추가하고 싶지 않기 때문에 하드코딩되어 있으므로 여기서 수정하겠습니다. 이름을 매개변수로 전달할 수도 있습니다. 그것은 귀하의 편의에 달려 있습니다.
3: 모든 매개변수는 ''일 수 있지만 첫 번째 매개변수는 기본적으로 이것이다. 스크립트는 관련 매개변수를 자동으로 결정합니다.