图片上传

最新推荐文章于 2024-07-22 17:09:19 发布

qq28754889

最新推荐文章于 2024-07-22 17:09:19 发布

阅读量458

点赞数

分类专栏： js学习笔记文章标签： function firefox file div input upload

js学习笔记专栏收录该内容

35 篇文章 0 订阅

订阅专栏

html

 </div>

var imgId = "";

$(document).ready(function () {


        $("#upload_form").attr("action", "/" + domainName + "/Space/" + userName + "/User/Upload");

    })
    function validateImg() {

        var x = document.getElementById("imageUrl");

        if (!x || !x.value) {

            return false;

        }

        var patn = /\.jpg$|\.jpeg$|\.png$|\.gif$/i;

        if (patn.test(x.value)) {

            return true;

        } else {

            alert("您选择的似乎不是图像文件。");

            return false;

        }

    }
    function preview() {

        var x = document.getElementById("imageUrl");

        if (!validateImg()) {

            return;

        }

    }
    function showmsg() {

        if (!validateImg()) {

            return false;

        }

        var obj = document.getElementById('imageUrl');

        if (!perImg(obj)) {

            return false;

        }





        document.getElementById("msg").innerHTML = '文件上传中...';

        return true;

    }

    function getUrlCallBack(url) {



//        document.getElementById("imgView").src = url;
//        document.getElementById("u_images").src = url;

        window.location.href = window.location.href;


        document.getElementById("msg").innerHTML = '文件上传成功';

        myInfocancel()

    }

    function image_change() {

        $("#icon").hide();

        $("#m_icon").show();
        document.getElementById("msg").innerHTML = '';
    }
    function myInfocancel() {

        $("#icon").show();

        $("#m_icon").hide();

    }

    var ffpath = "";
    var FilePath = {
        getFilePath: function (fileBrowser) {
            if (navigator.userAgent.indexOf("MSIE") != -1) {
                fileBrowser.select();
                fileBrowser.blur();
                var fp = document.selection.createRange().text;
                return fp;
            }
            else if (navigator.userAgent.indexOf("Firefox") != -1 || navigator.userAgent.indexOf("Mozilla") != -1) return this.getFilePathWithFF(fileBrowser);
            else { alert("Not IE or Firefox (userAgent=" + navigator.userAgent + ")"); }
        },
        getFilePathWithFF: function (fileBrowser) {
            try {
                netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
            } catch (e) {
                alert('由于浏览器安全问题请按照以下设置 [1] 地址栏输入 "about:config" ; [2] 右键新建 -> 布尔值 ; [3] 输入 signed.applets.codebase_principal_support" (忽略引号).');
                return;
            }
            var fileName = fileBrowser.value;
            var file = Components.classes["@@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
            try {
                // Back slashes for windows
                file.initWithPath(fileName.replace(/\//g, "\\\\"));
            } catch (e) {
                if (e.result != Components.results.NS_ERROR_FILE_UNRECOGNIZED_PATH) throw e;
                alert("File '" + fileName + "' cannot be loaded: relative paths are not allowed. Please provide an absolute path to this file.");
                return;
            }

            return file.path;
        }
    }

    function perImg(o) {
        var filepath = ""; //文件路径
        var agent = window.navigator.userAgent;
        var isIE7 = agent.indexOf('MSIE 7.0') != -1;
        var isIE8 = agent.indexOf('MSIE 8.0') != -1;
//        if (!o.value.match(/.jpg|.gif|.png|.bmp/i)) {
//            alert('图片格式无效！');
//            return;
//        }
        if (agent.indexOf("Firefox") != -1) {
            //火狐浏览器判断
            ffpath = "file:///" + FilePath.getFilePath(document.getElementById("imageUrl"))//显示预览图
            document.getElementById("imgView").src = ffpath;
           // alert(document.getElementById("imgView").src);
            var fileSize = GetFileSize(o); //获取文件大小
            //alert(fileSize);
            if (fileSize >3*1024 * 1024) {
                alert("文件不能大于3M");
                return false;
            } else {
               // alert("文件符合大小");
                return true;
            }
        } else {//IE浏览器
            document.getElementById("imgView").src = o.value; //显示预览图片
            var img = new Image(); //动态创建img
            //alert(o.value)
            img.src = o.value;
            img.style.display = "none";
            if (img.readyState == "complete") {//已经load完毕，直接打印文件大小
               // alert(img.fileSize); //ie获取文件大小
                if (img.fileSize > 3 * 1024 * 1024) {
                    alert("文件不能大于3M");
                    return false;
                } else {
                   // alert("文件符合大小");
                    return true;
                }
            } else {
              return img.onreadystatechange = function () {
                    if (img.readyState == 'complete') {//当图片load完毕
                        //alert(img.fileSize); //ie获取文件大小
                        if (img.fileSize > 3 * 1024 * 1024) {
                            alert("文件不能大于3M");
                            return false;
                        } else {
                            //alert("文件符合大小");
                            return true;
                        }

                    }
                }
            }
        }
    }
    //FF判断文件大小函数
    function GetFileSize(fileObj) {
        var image = new Image();
        image.dynsrc = ffpath;
        var fileSize = image.fileSize || 0;
        if (fileSize == 0) {
            fileSize = fileObj.files[0].size;
        }
        return fileSize;
    }

    function showImage() {
        var agent = window.navigator.userAgent;
        if (agent.indexOf("MSIE") != -1) {

            document.getElementById("imgView").src = document.getElementById("imageUrl").value;
        }else {
//            var src = FilePath.getFilePath(document.getElementById("imageUrl"));
//            src = src.replace(/\\/g, "/")

            document.getElementById("imgView").src = "file:///" + FilePath.getFilePath(document.getElementById("imageUrl"));

        }


    }

    function previewImage(file) {
        var MAXWIDTH = 128;
        var MAXHEIGHT = 128;
        var docObj = document.getElementById("imageUrl")
        var div = document.getElementById('preview');
        var imgObjPreview = document.getElementById("imgView");
        if (file.files && file.files[0]) {
            div.innerHTML = '<img id=imgView>';
            var img = document.getElementById('imgView');
            img.onload = function () {

                img.width = 128;
                img.height =128;

            }
            var reader = new FileReader();
            reader.onload = function (evt) { img.src = evt.target.result; }
            reader.readAsDataURL(file.files[0]);
        }
        else {
            docObj.select();
            var imgSrc = document.selection.createRange().text;
            var localImagId = document.getElementById("preview");
            //必须设置初始大小
            localImagId.style.width = "128px";
            localImagId.style.height = "128px";
            //图片异常的捕捉，防止用户修改后缀来伪造图片
            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();
        }
    }
    function clacImgZoomParam(maxWidth, maxHeight, width, height) {
        var param = { top: 0, left: 0, width: width, height: height };
        if (width > maxWidth || height > maxHeight) {
            rateWidth = width / maxWidth;
            rateHeight = height / maxHeight;

            if (rateWidth > rateHeight) {
                param.width = maxWidth;
                param.height = Math.round(height / rateWidth);
            } else {
                param.width = Math.round(width / rateHeight);
                param.height = maxHeight;
            }
        }

        param.left = Math.round((maxWidth - param.width) / 2);
        param.top = Math.round((maxHeight - param.height) / 2);
        return param;
    }