zoukankan      html  css  js  c++  java
  • input标签上传图片怎么获取src;

    1. 大家都知道input标签可以上传文件
      如:
    <input type="file"/>
    

    就可以上传文件,当然也可以上传图片,上传的图片的src地址如何取到:

     var reader = new FileReader();
                reader.onload = function(e){
                    console.log(e.target.result)
                }
                reader.readAsDataURL(file.files[0]);
    

    e.target.result就是src;其实这个方法就是把你上传的图片转化成base64进行在网络上流通,在控制台可看出

    附一个例子:

    <div class="demo"><img width="200px">
    <input type="file" onchance="demo(this)"/>
    </div>
    
     function demo(file)
      {
        if (file.files && file.files[0])
        {
          var reader = new FileReader();
          reader.onload = function(evt){
            jQuery(".demo img").attr("src",evt.target.result)
            console.log(evt.target.result)
          }
          reader.readAsDataURL(file.files[0]);
        }
        else
        {
          jQuery(".demo img").attr("src",evt.target.result)
        }
      }
    

    如果想要美观也可做个模态框。如果想要更多功能可以用插件fileupload自行百度谷歌。

  • 相关阅读:
    join
    runlevel 运行级别
    腾讯一shell试题.
    awk grep sed 的一些问题
    while read line do done < file
    awk 中 RS,ORS,FS,OFS 区别与联系
    节选
    rpm -qa -qc 查询安装过的软件
    css实现两端对齐
    JS表单验证
  • 原文地址:https://www.cnblogs.com/webwangjin/p/6208638.html
Copyright © 2011-2022 走看看