input标签上传图片怎么获取src;
- 大家都知道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;的更多相关文章
- 关于获取input标签属性的获取以及更改,此处用到的是readonly属性
一开始,我使用的是Jquery框架中的$.("#input").readOnly,发现取出的值为undefined,不知道是不是jQuery中不支持获取标签属性的函数, 然后就使用 ...
- H5 使用input标签上传图片给后台
html代码: <div class="hpk-showimg"> <!-- 营业执照 --> <div class="idcardup&q ...
- jQuery通过input标签的name获取值
jquery根据name属性查找 $("div[id]") 选择所有含有id属性的div元素 $("input[name='keleyicom']") 选择所有 ...
- 为什么JS动态生成的input标签在后台有时候没法获取到
最近在做一个产品添加的功能,需求有点奇葩,所以在添加的时候免不了要用到动态生成控件,然后我就使用了JS去动态生成一些 checkbox类型的input标签,在以前用asp.net在后台生成的input ...
- 有趣的js获取input标签中光标的索引
先看动图如下,我们就可以很清楚的知道获取input标签中光标的索引的意思了. 由于IE支持document.selection,Firefox,Chrome,Safari以及Opera都有select ...
- juqery 点击谁获取他的值,赋给input标签
//html代码 <a href="javascript:;" class="confirm fahuo" data-fahuo-id="{$v ...
- input/radio/select等标签的值获取和赋值
input/radio/select等标签的值获取和赋值,这几个是使用率最高的几个标签,获取值和赋值以及初始化自动填充数据和选择: 页面html: <div class=" " ...
- angularjs <input>标签获取时间显示问题
一般的后台管理中,几乎每个管理后台都有设置新密码的功能,但是获取的时候为了好看,都有统一用一定的标签,比如input标签,ng-model来控制显示数据,但是在获取时间的时候用会显示错乱 代码为: & ...
- 如何获取Input标签自定义属性的值?
HTML代码: <input type="hidden" value="${Name?if_exists}" id='ID' busCode = &quo ...
随机推荐
- 为SQL Server表中的列添加/修改/删除注释属性(sp_addextendedproperty、sp_updateextendedproperty、sp_dropextendedproperty)
本篇基本完全参考:sql--sp_addextendedproperty和sp_updateextendedproperty (Transact-SQL) 三个存储过程用法一样,以sp_addexte ...
- cmd 进入不同的驱动盘及上下级目录
“开始”=>“运行”,输入”cmd“,此时进入的是系统管理员的等待命令 如果想进入相应的盘符,如 d 盘,则输入 cd d:\,然后再次输入 d: 即可进入 d: 盘,输入两次相当于第二在是询问 ...
- 常用css表达式-最小宽度-上下居中
/* IE6下最小宽度的CSS表达式 */ width:100%; min-width:1024px; _width:expression((document.documentElement.clie ...
- TensorFlow和最近发布的slim
笔者将和大家分享一个结合了TensorFlow和最近发布的slim库的小应用,来实现图像分类.图像标注以及图像分割的任务,围绕着slim展开,包括其理论知识和应用场景. 之前自己尝试过许多其它的库,比 ...
- freeswitch 拨号时添加自定义变量
Using Channel Variables in Dialplan Condition Statements Channel variables can be used in conditions ...
- onethink 换空间报错 解决方案
onethink 换空间的时候有两个配置文件 Application\Common\Conf Application\User\Conf 如果报错先测试数据库 <?php $con = mysq ...
- C#获取硬盘空间信息
/// <summary> /// 获取指定驱动器的空间总大小(单位为B) /// </summary> /// <param name="str_HardDi ...
- hexdump——Linux系统的二进制文件查看工具
hexdump是Linux下的一个二进制文件查看工具,可以将二进制文件转换为ASCII.10进制.16进制或8进制进行查看. 首先我们准备一个测试用的文件test,十六进制如下: 00 01 02 0 ...
- 用VS2010编写的C++程序,在其他电脑上无法运行,提示缺少mfc100.dll的解决办法
问题: 在自己电脑上用VS2010编写的VC++程序(使用MFC库),不能在其他电脑上运行.双击提示: "无法启动此程序,因为计算机中丢失mfc100.dll 尝试重新安装该程序以解决此问题 ...
- 【关于JavaScript】常见表单用户名、密码不能为空
在论坛等系统的用户注册功能中,如果用户忘记填写必填信息,如用户名.密码等,浏览器会弹出警告框,提示用户当前有未填信息. 这个典型的应用就是通过JavaScript实现的.如图所示是一个简单的用户注册页 ...