码迷,mamicode.com
首页 > Web开发 > 详细

图片及时上传预览判断大小 /*添加了一些判断*/

时间:2015-06-16 16:35:30      阅读:168      评论:0      收藏:0      [点我收藏+]

标签:

function setImagePreview(dom,size,larger) {
        
        var x = 200;
        var y = 150;
        if(larger){
             x = 100;
             y = 75;
        }
        var docObj=dom;
        var imgObjPreview=$(dom).parent().find("img")[0];
        var val = dom.value.split(".");
       var ext = [‘gif‘, ‘jpg‘, ‘jpeg‘, ‘png‘];
        if (ext.join(",").indexOf(val[val.length-1]) > -1){
                true;
        }else{
            alert("您上传的图片格式不正确,请重新选择!");
            $(dom).val("");
            $(imgObjPreview).attr("src","images/zhong.png");
            return false;
        }
        if(docObj.files &&docObj.files[0]){
            imgObjPreview.style.display = ‘block‘;
            if(docObj.files[0].size>size){
                alert("图片过大!");
                $(dom).val("");
                $(imgObjPreview).attr("src","images/zhong.png");
                return false;
            }
            
            imgObjPreview.style.width = x+"px";
            imgObjPreview.style.height = y+"px";
            imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
            
        }
        else{
            docObj.select();
            var imgSrc = document.selection.createRange().text;
            var localImagId = $(dom).siblings("div")[0];
            var img=new Image();
            img.src=imgSrc;
            if(img.readyState=="complete"){
                if(img.fileSize > size){
                    alert("图片过大!");
                    $(localImagId).attr("src","images/zhong.png");
                    return false;
                }
            }else{
            img.onreadystatechange=function(){
            if(img.readyState==‘complete‘){
                if(img.fileSize > size){
                    alert("图片过大!");
                    return false;
                 }else{
                    localImagId.style.width = x+"px";
                    localImagId.style.height = y+"px";
                    try{
                        localImagId.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
                        localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
                    }
                    catch(e){
                        alert("您上传的图片格式不正确,请重新选择!");
                        return false;
                    }
                    imgObjPreview.style.display = ‘none‘;
                    document.selection.empty();
                }
                }
              }
             }
             $(dom).siblings("div").eq(0).addClass("tsp");
        }
        return true;
    }

 

 

<dt><input type="file" name="" onchange="javascript:setImagePreview(this,1024*1024);" class=‘renzheng‘><img src="images/zhong.png" />
            <input type="hidden" name="" value=‘‘/>
            <label id="company-error" class="error" for="company">公司名至少2位</label>
            <div></div>
            <div class=‘transtion-all change‘>点击更换图片</div>

</dt>

图片及时上传预览判断大小 /*添加了一些判断*/

标签:

原文地址:http://www.cnblogs.com/wangpeipei/p/4580928.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!