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 ...
随机推荐
- 实操记录之-----Ant Design of Vue 增强版动态合并单元格,自动根据数据进行合并,可自定义横纵向合并
前几天搞了个简易版的动态合并单元格 但是需求有变化,就只能稍微改改了~~ 欢迎路过的各位大佬指出我代码的问题~~~~ 另: 代码执行效率不是很高,如果需要大量渲染更多数据建议可以直接使用原生 < ...
- 引子 - 实现轻量的 ioc 容器
IoC 反转控制原则也被叫做依赖注入 DI, 容器按照配置注入实例化的对象. 假设 A 的相互依赖关系如下图, 如何将 A 对象实例化并注入属性. 本文将实现一个轻量化的 IoC 容器, 完成对象的实 ...
- 高并发环境下3种方式优化Tomcat性能
摘要:Tomcat作为最常用的Java Web服务器,随着并发量越来越高,Tomcat的性能会急剧下降,那有没有什么方法来优化Tomcat在高并发环境下的性能呢? 本文分享自华为云社区<[高并发 ...
- 字节输出流的续写和换行-字节输入流_inputS Stream类
字节输出流的续写和换行 package demo02.OutputStream; import java.io.FileOutputStream; import java.io.IOException ...
- QtQuick使用MediaPlayer抓取摄像头影响报错Error: "Your GStreamer installation is missing a plug-in."
环境:ubuntu18.04 Qt5.9.5 描述:项目需要使用qtquick作为显示界面用于播放从网络摄像头抓取的影像,海康网络摄像头,摄像头源协议使用的是rtsp,影像数据格式为x-h264,但在 ...
- 力扣---1306. 跳跃游戏 III
这里有一个非负整数数组 arr,你最开始位于该数组的起始下标 start 处.当你位于下标 i 处时,你可以跳到 i + arr[i] 或者 i - arr[i]. 请你判断自己是否能够跳到对应元素值 ...
- 时间轮TimeWheel工作原理解析
时间轮工作原理解析 一.时间轮介绍 1.时间轮的简单介绍 时间轮(TimeWheel)作为一种高效率的计时器实现方案,在1987年发表的论文Hashed and Hierarchical Timing ...
- Mat数据结构
1.MAT类: OpenCV从2001年开始发展,在最初使用的是c语言,使用的是IplImage数据结构来存储图像,但是最大的问题需要手动申请释放内从( manual memory managemen ...
- EPICS Archiver Appliance的定制部署1
https://blog.csdn.net/weixin_43767046/article/details/112116112 简单部署试了一下之后,又试了下Site specific install ...
- Nginx单服务器部署多个网站,域名
转载csdn: https://blog.csdn.net/yaologos/article/details/113356620 转载亿速云: https://www.yisu.com/zixun/1 ...