通过不同的浏览器得到上传图片并显示到页面上

//表单代码
<div class="col-sm-offset-1 col-sm-7">
    <div class="well">
        添加广告信息：
        <form action="" method="post">
        <input type="file" class="filestyle" data-buttonName="btn-primary" id="upload" onchange="localShowImage();">
        <img id="perview" src="" class="img-responsive">
        <input type="submit" class="btn btn-info" value="上传">
        </form>
    </div>
</div>

<script type="text/javascript">
    function getOS(){
        var OsObject = "";
        if(navigator.userAgent.indexOf("MSIE")>0) {
            return "MSIE";
        }
        if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){
            return "Firefox";
        }
        if(isSafari=navigator.userAgent.indexOf("Safari")>0) {
            return "Safari";
        }
        if(isCamino=navigator.userAgent.indexOf("Camino")>0){
            return "Camino";
        }
        if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){
            return "Gecko";
        }
    }
    function localShowImage() {
        // IE浏览器获取图片路径
        this.getImgUrlByMSIE = function(fileid) {
            return document.getElementById(fileid).value;
        };
        // 非IE浏览器获取图片路径
        this.getImgUrlByUnMSIE = function(fileid) {
            var f = document.getElementById(fileid);
            return window.URL.createObjectURL(f.files[0]);
        };
        var imgsrc="";
        var fid ='upload';
        alert("getOS() = "+ getOS());
        if("MSIE" == getOS()) {
            imgsrc = this.getImgUrlByMSIE(fid);
        } else {
            imgsrc = this.getImgUrlByUnMSIE(fid);
        }
        document.getElementById('perview').src = imgsrc;
    }
</script>

转载于:https://my.oschina.net/chinacaptain/blog/367465