zoukankan      html  css  js  c++  java
  • 上传图像在线预览

    上传图像在线预览

      问题:很多网站中目前都存在上传图像、更新个人图像的功能。人性化在线预览功能更有助于客户体验。

    在页面中插入以下JS代码即可。

    <script type="text/javascript">
        var input  = document.getElementById("inputImage");   // 获取上传图片input(file)
        input.onchange = function(){
            var file = this.files[0];// 获取上传的第一张图片,若希望input实现多文件上传。添加属性multiple="multiple"。
            if(!!file){// 判断是否选择文件
                var reader = new FileReader();// 读取文件对象
                // 图片文件转换为base64
                reader.readAsDataURL(file);// 读取文件
                reader.onload = function(){// 读取完毕执行
                      // 获取显示图片img。设置src属性地址为显示当前选择的图像
                      document.getElementById("file_img").src = this.result;
                }
            }
        };
    </script>
    你是否还会在灯火下守候……
  • 相关阅读:
    基础
    树梅派线程
    超声波
    电脑版微信双开多开
    子类能不能重写父类的构造方法
    window8taskost.exe一直占用cpu
    windows下rocketmq安装
    spring循环依赖问题
    线程池的种类
    并行和并发有什么区别?
  • 原文地址:https://www.cnblogs.com/xsge/p/13541880.html
Copyright © 2011-2022 走看看