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 ...
随机推荐
- Windows phone 之自定义控件(补充)
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x= ...
- c++相关知识回顾
1.typedef typedef用来定义同类型的同义词.如: typedef unsingned int size_t; typedef int ptrdiff_t; typedef T * ite ...
- iOS 从C移植项目到Objective-C
一.新建项目 iOS | Framework & Library Cocoa Touch Static Library 新建一个Library库 1. M.h头文件 #ifndef M_h # ...
- Jquery获取元素坐标
获取页面某一元素的绝对X,Y坐标,相对于浏览器窗体,可以用offset()方法: var X = $('#DivID').offset().top; var Y = $('#DivID').offse ...
- ubuntu14.04安装wine以及国际版QQ
公社(http://www.linuxidc.com/linux/2014-06/103768.htm)说: Wine (“Wine Is Not an Emulator” 的首字母缩写)是一个能够在 ...
- WebApi(四)-Post接口请求失败或接受不到参数(解决方法)
post方式只能接受一个参数而且必须用FromBody特性标识,所以当没有使用FromBody特性标识的时候就会请求失败,如有添加添加了那访问接口时候参数应传对象不能是key:val的格式否则会接收到 ...
- Spring(一)——总体介绍
spring框架,是进行对象管理,对象关联,解耦的一个中间层框架.SSH(Struts+Spring+hibernate)三大Spring在中间就起着一个承上启下的作用.好,首先我们先来 ...
- IntraWeb.v14.0.32安装及破解指南
一.下载 首先从这里下载14.0.32版本的IntraWeb: 链接:http://pan.baidu.com/s/1c0rjnKO 密码:8kv2 二.卸载旧版 1. 我的Delphi版本是XE6, ...
- webkit.net使用方法日记
1.首先貌似只有36位的库,所以项目也要修改为X86平台 2.里面的所有dll库文件都要拷贝到项目中去,包括WebKitBrowser.dll.manifest 此文件一定要拷贝过去. 3.然后引用 ...
- tyvj 普通平衡树 SBT or splay
普通平衡树 From admin 背景 Background 此为平衡树系列第一道:普通平衡树 描述 Description 您需要写一种数据结构(可参考题目标题),来维护一些数,其中 ...