必威体育Betway必威体育官网
当前位置:首页 > IT技术

实时显示从file输入框中打开的图片C:\fakepath问题

时间:2019-06-19 07:45:20来源:IT技术作者:seo实验室小编阅读:59次「手机版」
 

fakepath

一、问题产生原因

1、今天维护公司项目,需要修改一个上传图片显示的问题,就是实时显示一个从file input上传的图片问题,以下是demo:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="jquery-1.11.1.js"></script>
</head>
<body>
	<input id="inFile" type="file">
	<img src="" alt="1111">
</body>
</html>
<script>
$(function(){
	$("#inFile").on("change",function () {
		$("img").attr("src",$(this).val());
	});
});
这就是控制台的显示,预想的图片并没有显示出来,路径也变成了C:\fakepath\1.png

二、解决方案

搜了一堆解决方案,针对浏览器各种搞,然而没用。最后从黄者之风博客上找到了有用的解决方案。

	<script>
	$(function(){
		$("#inFile").on("change",function () {
	        var $file = $(this);
	        var fileObj = $file[0];

	        var windowURL = window.URL || window.webkitURL;
	        var dataURL;
	        var $img = $("img");

	        if (fileObj && fileObj.files && fileObj.files[0]) {
	            dataURL = windowURL.createObjectURL(fileObj.files[0]);
	            $img.attr('src', dataURL);
	        } else {
	            dataURL = $file.val();
	            var imgObj = document.getElementById("preview");
	            imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
	            imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;

	        }
	    });
	});

亲测在IE、Chrome、Firefox、edge均可以正常展示图片,以下是Chrome展示,虽然显示的地址依然不是理想的,但是图片能显示就OK。

相关阅读

WritePrivateProfileString等读写.ini配置文件

配置文件中经常用到ini文件,在VC中其函数分别为:写入.ini文件:BOOL WritePrivateProfileString( LPCTSTR lpAppName, // INI文件

textfile,sequencefile和rcfile的使用与区别详解

hive在创建表时默认存储格式是textfile,或者显示自定义的stored as textfile.很多人知道hive常用的存储格式有三种,textfile,seque

c#语言------------FileStream类的基本使用

FileStream类不是静态类,使用时需要创建对象,FileStream类既可以对文本文件进行读也可以对多媒体文件进行写,以字节数组的形式进行读

no input file specified 解决方法

删掉根目录下的  .user.ini 文件就好了

文件流FileStream技术出现的理由漫谈

还是废话不多说,一般我们读写文本通过File类中的几个方法是可以满足我们的需求的,如下 File.ReadAllLines("文件路径") 这个方

分享到:

栏目导航

推荐阅读

热门阅读