• JS实现图片上传之前先预览


    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
        <script type="text/javascript" src="jquery-1.8.1.min.js" > </script>
        <script type="text/javascript">
    // 获取本地上传的照片路径 
    function getPath(obj) { 
              if (obj) { 
                  //ie 
                  if (window.navigator.userAgent.indexOf("MSIE") >= 1) { 
                      obj.select(); 
                      // IE下取得图片的本地路径 
                      return document.selection.createRange().text; 
                  
                  //firefox 
                  else if (window.navigator.userAgent.indexOf("Firefox") >= 1) { 
                      if (obj.files) { 
                          // Firefox下取得的是图片的数据 
                          return obj.files.item(0).getAsDataURL(); 
                      
                      return obj.value; 
                  
                  return obj.value; 
              
          
    //显示图片
       
    function previewPhoto(){ 
        var picsrc=getPath(document.all.fileid); 
        var picpreview=document.getElementById("preview"); 
        if(!picsrc){  
         return
        
        if(window.navigator.userAgent.indexOf("MSIE") >= 1) { 
             if(picpreview) { 
              try
                     picpreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = picsrc; 
                    }catch(ex){ 
               alert("文件路径非法,请重新选择!") ; 
               return false
              
         }else{  
            picpreview.innerHTML="<img src='"+picsrc+"' />"
         
       
       
       
       
    function preImg(fileid, imgid) {
        if (typeof FileReader == 'undefined') {
            var picsrc=getPath(document.all.fileid)
            $("#imgid").attr({ src: picsrc});
            previewPhoto();
        }
        else{
        var reader = new FileReader();
        var name=$("#fileid").val();
        var picpreview=document.getElementById("preview"); 
        reader.onload = function(e) {
            var img = document.getElementById(imgid);
            //img.src = this.result;
            picpreview.innerHTML="<img src='"+this.result+"' style=' 179px; height: 189px;' />"
        }
        reader.readAsDataURL(document.getElementById(fileid).files[0]);
    }
    }
       
      </script>
     </head>
     <body>
     <div id="preview" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale); 180px;height:190px;border:solid 1px black;"
       
    <input type="file" id="fileid" name="photofile" onchange="preImg(this.id,'imgid');"/>
     </body>
    </html>
  • 相关阅读:
    安装VMware Tools选项显示灰色的正确解决办法
    Other UltraISO 软碟通注册码
    Linux平台Boost 1.6.7的编译方法
    hyper-v显示分辨率如何自动调整
    Ubuntu 14.04下超级终端Minicom连接ARM(转)
    Ubuntu 17.10安装VirtualBox 5.2.2 及相关问题解决
    ffmpeg fails with error "max delay reached. need to consume packet"
    Unity Shader 屏幕后效果——边缘检测
    C++ STL vector容量(capacity)和大小(size)的区别
    Unity影响渲染顺序因素的总结
  • 原文地址:https://www.cnblogs.com/telwanggs/p/5306183.html
Copyright © 2020-2023  润新知