• 本地图片显示在网页


    <if condition="$member_info['member_avatar']">
                            <img style="display: inline-block;border-radius: 100%" id="page-pic" width="80px"  height="80px"  src="__PUBLIC__/member/avatar/<!--{$member_info.member_avatar}-->"/>
                        <else />
    
                            <img style="display: inline-block;border-radius: 100%"id="page-pic" width="80px"  height="80px"  src="__PUBLIC__/member/avatar/grzx.png"/>
                    </if>
                        <input type="file" onchange="filePic(this)" value="" placeholder="" id="member_avatar" name="member_avatar">
    
    
    
    /**
    * 从 file 域获取 本地图片 url
    */
    function getFileUrl(sourceId) {
    var url;
    if (navigator.userAgent.indexOf("MSIE") >= 1 && !(navigator.userAgent.indexOf("MSIE 10.0") > 0) ) { // IE10取消了滤镜
    //url = document.getElementById(sourceId).value;
    document.all.imgOne.select();
    $("#preview").focus();
    url = document.selection.createRange().text;
    } else if (navigator.userAgent.indexOf("Firefox") > 0) { // Firefox
    url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    } else if (navigator.userAgent.indexOf("Chrome") > 0) { // Chrome
    url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    }else if(navigator.userAgent.indexOf("MSIE 10.0") > 0){
    url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    }else{
    url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    }
    return url;
    }
    
    /**
    * 将本地图片 显示到浏览器上
    */
    function preImg(sourceId, target) {
    var url = getFileUrl(sourceId);
    if(window.navigator.userAgent.indexOf("MSIE") >= 1 && !(navigator.userAgent.indexOf("MSIE 10.0") > 0) ) {
    var picpreview=document.getElementById("preview");
    picpreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = url;
    }else{
    $("#page-pic").attr("src",url);
    }
    
    }
    
    function filePic(h) {
    if (!h.files.length) {
    alert("未选择文件");
    return;
    }
    var type, h_type;
    h_type = h.value.split(".");
    type = h_type[h_type.length - 1].toLocaleLowerCase();
    var file = h.files[0];
    if ((type != "jpg" && type != "png" && type != "jpeg")) {
    h.value = "";
    h.files = null;
    alert("抱歉,仅支持的jpg或png或者jpeg图片");
    return;
    }
    var hID = h.id;
    preImg(hID);
    }
    
  • 相关阅读:
    FFmpeg解码的软解及硬解(cuda和qsv)使用方法
    修改 Chromium 源码,实现 HEVC/H.265 4K 视频播放
    代码的重构记录
    UML图示详解
    .Net6 Api 里使用版本控制(Versioning)
    HttpClient和IHttpClientFactory借助第三方库生成的客户端Refit andWebApiClientCore
    .NET 6.0中定制日志记录
    部署Redis集群
    Redis相比MemoryCache有哪些优势?
    Visual Studio神级插件之CodeMaid自动整理你的代码
  • 原文地址:https://www.cnblogs.com/bubaya/p/7565045.html
Copyright © 2020-2023  润新知