开发者

client side file upload validation (no upload)

I'm looking for a simple easy-to-use client开发者_开发知识库 side upload validator. It doesn't need to handle the upload itself (this is being handled fine by POST and a server side script).

I've looked into a fair bit, and it's clear it can't be done with js alone. Other solutions recommend use of activeX which seems to have inconsistent results on different browsers.

Flash is a obvious favourite, but the flash solutions such as UPLOADIFY and SWFUploader seem to bundled with ajax uploaders and progress bars. This is likely to disrupt my existing form and server side processing scripts, so I'm just looking for a simple mechanism to validate the file either on blur or change on the file input, or on submission of the form. But I don't want the validator to do anything other than provide validation in order that my existing upload scripts continue to work as they are at the moment.

Is this too much to ask for?!

Thanks.


This must be the first working code tested on chrome safari firefox opera and of course, explorer. client-side image (type/size) upload validation

<form><fieldset><legend>Image upload</legend>
<input type=file onchange="getImg(this,500,'jpeg|png')">
</fieldset>
</form>

<script>

function getImg(input,max,accepted){
    var upImg=new Image(),test,size,msg=input.form;
    msg=msg.elements[0].children[0];

    return input.files?validate():
    (upImg.src=input.value,upImg.onerror=upImg.onload=validate);

        "author: b.b. Troy III p.a.e";

    function validate(){
        test=(input.files?input.files[0]:upImg);
        size=(test.size||test.fileSize)/1024;
        mime=(test.type||test.mimeType);

    mime.match(RegExp(accepted,'i'))?
    size>max?(input.form.reset(),msg.innerHTML=max+"KB Exceeded!"):
    msg.innerHTML="Upload ready...":    
    (input.form.reset(),msg.innerHTML=accepted+" file type(s) only!")
    }
}

</script> 

</body>
</html>


<form><fieldset><legend>Image upload</legend> 
<input type=file onchange="getImg(this,500,'jpeg|png')"> 
</fieldset> 
</form> 

<script> 

function getImg(input,max,accepted){ 
    var upImg=new Image(),test,size,msg=input.form; 
    msg=msg.elements[0].children[0]; 

    return input.files?validate(): 
    (upImg.src=input.value,upImg.onerror=upImg.onload=validate); 

        "author: b.b. Troy III p.a.e"; 

    function validate(){ 
        test=(input.files?input.files[0]:upImg); 
        size=(test.size||test.fileSize)/1024; 
        mime=(test.type||test.mimeType); 

    mime.match(RegExp(accepted,'i'))? 
    size>max?(input.form.reset(),msg.innerHTML=max+"KB Exceeded!"): 
    msg.innerHTML="Upload ready...":     
    (input.form.reset(),msg.innerHTML=accepted+" file type(s) only!") 
    } 
} 

</script>  
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜