jquery 中上传的图片file文件,如果在html img元素中通过src展示 ,可以img的图片src属性直接去等于file文件吗,如果不可以的话,那么src怎么去展示file文件呢
bot回答:
Answer: 不可以。文件不能直接设置为 img 元素的 src 属性值。要展示 file 文件,需要在 img 属性中使用 JavaScript 来实现,可以参考以下代码:
<img id="uploaded-image" />
<input type="file" id="image-input" />
<script>
// 监听文件输入:
document.querySelector('#image-input').addEventListener('change', function() {
let file = this.files[0];
// 将文件作为图片渲染:
let reader = new FileReader();
reader.onload = function(e){
document.querySelector('#uploaded-image').src = e.target.result;
};
reader.readAsDataURL(file);
});
</script>
博友回答:
https://www.cnblogs.com/eret9616/p/13231542.html
读取到的file文件对象,
想给img标签使用,直接挂到src上不能用
可以用这个api操作下
img.src = window.URL.createObjectURL(file);
jquery 中上传的图片file文件,如果在html img元素中通过src展示 ,可以img的图片src属性直接去等于file文件吗,如果不可以的话,那么src怎么去展示file文件呢的更多相关文章
- Core在IIS的热发布问题或者报错文件已在另一个程序中打开
关于Core发布到IIS的热发布问题,或者覆盖dll文件的时候会报错"文件已在另一个程序中打开",也就是无法覆盖程序的问题,经过百度和分析总结以下几种方案: 一.使用app_off ...
- 将文件从已Root Android手机中copy出来的几个cmd窗口命令
将文件从已Root Android手机中copy出来的几个cmd窗口命令: 以shell身份登录adbadb shell进入adb后切换至root用户su更改文件的所属chown shell *更改文 ...
- .net项目中上传的图片或者文件太大 无法上传
最近做项目的时候 用户提出要上传大图片 一张图片有可能十几兆 本来用的第三方的上传控件 有限制图片上传大小的设置 以前设置的是2M 按照用户的要求 以为直接将限制图片上传大小的设置改下就可 ...
- 【应用服务 App Service】App Service中上传文件/图片(> 2M)后就出现500错误(Maximum request length exceeded).
问题描述 在使用App Service (Windows)做文件/图片上传时候,时常遇见上传大文件时候出现错误,这是因为IIS对文件的大小由默认限制.当遇见(Maximum request lengt ...
- js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)
原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...
- jquery上传文件控件Uploadify
基于jquery的文件上传控件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件. 要求使用jquery1.4或以上版本,flash player 9.0.24以上. 有两个 ...
- 文件上传利器JQuery上传插件Uploadify
在做日常项目中,经常在后台需要上传图片等资源文件,之前使用过几次这个组件,感觉非常好用 ,但是每次使用的时候都是需要经过一番查阅,所以还不如记住在这里,以后使用的时候就翻翻. 他的官方网站如下:htt ...
- SharePoint REST API - 使用REST API和jQuery上传一个文件
博客地址:http://blog.csdn.net/FoxDave 本篇主要通过两个代码示例来展示如何应用REST API和jQuery上传文件到SharePoint. 示例会使用REST接口和j ...
- jQuery上传文件控件Uploadify使用
Uploadify是JQuery的一个上传插件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件等. 首先应下载jQuery和uploadify插件 jQuery下载地址:h ...
- jQuery上传文件显示进度条
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script sr ...
随机推荐
- webpack动态配置多静态资源路径,动态配置多上线路径,配置less,多种图片引用方式----"webpack": "^4.41.6",
1.项目场景是有两个静态资源目录,一个用于开发,一个用于发布,上线多个版本,打包多个版本后,也要部署到同一个服务器的同一个端口下. 根据我自己的摸索,我搞出来了下面的配置,自感觉还蛮好用的 先看我的c ...
- 结构型模式 - 外观模式Facade
1.tm的NT审核机制,满篇文章哪来的广告? 就算有也是你们自己加的吧?等财富能支持我自己的网站后,就是和你们说再见之时. 2.tm第二遍说,我接着提交,这个审核机制的傻逼设计者或者是程序敲出来的bu ...
- Linux三剑客日志处理系列
三剑客日志处理系列 一.特殊符号 1.引号系列 必会 引号 含义 单引号 所见即所得,单引号里的内容会原封不动输出 双引号 和单引号类似,对双引号里面的特殊符号进行解析,对于{}花括号(通配符)没有解 ...
- Cpp 友元简述
友元函数,友元类 使用友元,主要是易于直接访问数据,但友元本质是以破坏封装性为代价. 下例引用于: <C++程序设计(第2版)> 友元声明位置由程序设计者决定,且不受类中public.pr ...
- Vue13 样式动态绑定
1 class样式的动态绑定 1.1 说明 通过命令v-bind:class设置一个对象,动态切换class.可以简写为:class. class=""可以和:class=&quo ...
- 实现简单的`Blazor`低代码
本篇博客只实现基本的低代码,比如新增组件,动态修改组件参数 创建项目 首先创建一个空的Blazor Server,并且命名LowCode.Web 实现我们还需要引用一个Blazor组件库,由于作者用M ...
- LeetCode 周赛 332,在套路里摸爬滚打~
本文已收录到 AndroidFamily,技术和职场问题,请关注公众号 [彭旭锐] 提问. 大家好,今天是 3T 选手小彭. 上周是 LeetCode 第 332 场周赛,你参加了吗?算法解题思维需要 ...
- JZOJ 2020.02.25【NOIP提高组】模拟A 组
闲话 难度似乎比之前的简单了一些 但是难的题还是很难(我太菜了) 总结 针对三个题,先罗列正解所涉及的算法:字符哈希,组合数学,点分治 最后一个不会 组合数学?还好吧 字符哈希? 放在 \(T1\) ...
- [EULAR文摘] 脊柱放射学持续进展是否显著影响关节功能
脊柱放射学持续进展是否显著影响关节功能 Poddubnyy D, et al. EULAR 2015. Present ID: THU0199. 背景: 强直性脊柱炎(AS)患者的机体功能和脊柱活动性 ...
- 通过反射机制简化 JDBC ResultSet 实体类的注入
提出问题 查询完某个表之后,一般都是把结果的每一个字段注入到一个实体类中.比如,数据库 users 表,查询出来的结果注入到 User 实体类中. 通过 while 遍历 ResultSet,把字段对 ...