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自行百度谷歌。

input标签上传图片怎么获取src;的更多相关文章

  1. 关于获取input标签属性的获取以及更改,此处用到的是readonly属性

    一开始,我使用的是Jquery框架中的$.("#input").readOnly,发现取出的值为undefined,不知道是不是jQuery中不支持获取标签属性的函数, 然后就使用 ...

  2. H5 使用input标签上传图片给后台

    html代码: <div class="hpk-showimg"> <!-- 营业执照 --> <div class="idcardup&q ...

  3. jQuery通过input标签的name获取值

    jquery根据name属性查找 $("div[id]") 选择所有含有id属性的div元素 $("input[name='keleyicom']") 选择所有 ...

  4. 为什么JS动态生成的input标签在后台有时候没法获取到

    最近在做一个产品添加的功能,需求有点奇葩,所以在添加的时候免不了要用到动态生成控件,然后我就使用了JS去动态生成一些 checkbox类型的input标签,在以前用asp.net在后台生成的input ...

  5. 有趣的js获取input标签中光标的索引

    先看动图如下,我们就可以很清楚的知道获取input标签中光标的索引的意思了. 由于IE支持document.selection,Firefox,Chrome,Safari以及Opera都有select ...

  6. juqery 点击谁获取他的值,赋给input标签

    //html代码 <a href="javascript:;" class="confirm fahuo" data-fahuo-id="{$v ...

  7. input/radio/select等标签的值获取和赋值

    input/radio/select等标签的值获取和赋值,这几个是使用率最高的几个标签,获取值和赋值以及初始化自动填充数据和选择: 页面html: <div class=" " ...

  8. angularjs <input>标签获取时间显示问题

    一般的后台管理中,几乎每个管理后台都有设置新密码的功能,但是获取的时候为了好看,都有统一用一定的标签,比如input标签,ng-model来控制显示数据,但是在获取时间的时候用会显示错乱 代码为: & ...

  9. 如何获取Input标签自定义属性的值?

    HTML代码: <input type="hidden" value="${Name?if_exists}" id='ID' busCode = &quo ...

随机推荐

  1. 创业 CEO:如何选择投资人

    欢迎来到「创业 CEO」系列,在这个系列中,我们讨论一个创业者如何教会自己成为一位伟大的 CEO,因为历史上最伟大的创业公司,往往都是由这样的人在领导. AppWorks 成立至今,总共参与投资了 2 ...

  2. Java连接mySql—JDBC连接数据库

    利用JDBC开发数据库 经典应该用框架: 第一步,加载JDBC数据库驱动程序(不同的数据库有不同的数据库驱动,所以在连接数据库之前,需加载驱动) 格式: String driver = "c ...

  3. div模块变灰

    整站变灰目前没发现什么特别好的办法,但是div(或者其他标签模块)模块变灰方法兼容性还不错. .gay_box{ filter: grayscale(100%); -webkit-filter: gr ...

  4. 添加标签2 jquery 和JS

    TAG添加标签 做了个方法方便调用 一.JS版本 <!DOCTYPE html> <html lang="en"> <head> <met ...

  5. Apache 禁止访问目录

    1.打开apache配置文件httpd.conf 2.找到 <Directory /> Options Indexes AllowOverride None Order allow,den ...

  6. ASP.NET前台JS与后台CS函数如何互相调用

    摘要: 在实际的Web开发中,我们可能会常常遇到后台调用前台JS代码或者前台JS调用后台代码的情况.今天就把比较实用的前后台相互调用的方法总结出来和大家分享. 在实际的Web开发中,我们可能会常常遇到 ...

  7. 实现windows和linux的NFS交互

    说明:本文是Omni-NFS-X Windows与Linux间通讯的另一种方式和在windows中配置使用NFS客户端的杂交篇 概述 windows/winnt4.0/win2000与Linux/Fr ...

  8. Remote Direct Memory Access (RDMA)

    RDMA有三类实现方式,包括RoCE,iWARP和InfiniBand.RDMA的基础是Virtual Interface Architechure (VIA). 参考文档: https://en.w ...

  9. 利用R进行多元线性回归分析

    对于一个因变量y,n个自变量x1,...,xn,要如何判断y与这n个自变量之间是否存在线性关系呢? 肯定是要利用他们的数据集,假设数据集中有m个样本,那么,每个样本都分别对应着一个因变量和一个n维的自 ...

  10. MATLAB中的结构数组

    MATLAB中的结构数组 结构数组: 结构是包含一组记录的数据类型,而记录则是存储在相应的字段中.结构的字段可以是任意一种MATLAB数据类型的变量或者对象.结构类型的变量也可以是一维的.二维的或多维 ...