用JavaScript实现“上传并预览图片”时，默认浏览器Firefox无法获得图片路径，显示fakepath，如何解决？
使用chrome时出现同样问题，但是IE好像就能正常显示。如何获得正确路径？JS菜鸟求指教。代码如下：<html><head><metahttp-equiv="Conte...
使用chrome时出现同样问题，但是IE好像就能正常显示。
如何获得正确路径？JS菜鸟求指教。
代码如下：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function readFile(field, image) {
var obj_0=document.getElementsByName(field)[0];
var obj_1=document.getElementsByName(image)[0];
if(obj_0 == null || obj_1 == null)
{
alert("Pleas select an image");
return false;
}
else
{
obj_1.src="file:///"+obj_0.value;
return true;
}
}
</script>
<title>Image Upload</title>
</head>
<body>
<form name="form" action="">
<img name="image" src=""/>
<input type="file" name="upload" onchange="return readFile('upload','image')"/>
<input type="submit" value="submit"/>
</form>
</body>
</html> 展开
如何获得正确路径？JS菜鸟求指教。
代码如下：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function readFile(field, image) {
var obj_0=document.getElementsByName(field)[0];
var obj_1=document.getElementsByName(image)[0];
if(obj_0 == null || obj_1 == null)
{
alert("Pleas select an image");
return false;
}
else
{
obj_1.src="file:///"+obj_0.value;
return true;
}
}
</script>
<title>Image Upload</title>
</head>
<body>
<form name="form" action="">
<img name="image" src=""/>
<input type="file" name="upload" onchange="return readFile('upload','image')"/>
<input type="submit" value="submit"/>
</form>
</body>
</html> 展开
5个回答
展开全部
浏览器安全性已经大大提高，要实现图片上传预览不是那么简单了
不过有很多变通或先进的方法来实现
例如ie7/ie8的滤镜预览法，firefox 3的getAsDataURL方法
具体可以参考这个图片上传预览效果
参考资料： http://www.blueidea.com/common/shoutbox/redir.asp?7=u&id=11586
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
先把代码发上来看看，肯定用了ie才支持的activeX,万恶的ie又害人了
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
也是一个教训啊，以后测试记得在firefox下面做，好了再到IE上面做小修改
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
if(obj_0 == null || obj_1 == null)
{
alert("Pleas select an image");
return false;
}
else
{
obj_1.src="file:///"+obj_0.value;
alert(obj_1.src);//加入这句打印信息
return true;
}
在指定位置添加alert语句，你再测试会发现，在chorme下obj_0.value只取到了图片的相对地址，也就是图片本身的名字，而图片所在的路径被丢弃了，从而导致显示不正确。这可能是各种浏览器对file控件实现的不同造成的。
{
alert("Pleas select an image");
return false;
}
else
{
obj_1.src="file:///"+obj_0.value;
alert(obj_1.src);//加入这句打印信息
return true;
}
在指定位置添加alert语句，你再测试会发现，在chorme下obj_0.value只取到了图片的相对地址，也就是图片本身的名字，而图片所在的路径被丢弃了，从而导致显示不正确。这可能是各种浏览器对file控件实现的不同造成的。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
您好！很高兴为您答疑！
目前新的浏览器都是禁止服务器通过客户端脚本获取完整路径的。
您可以在火狐社区了解更多内容。希望我的回答对您有所帮助，如有疑问，欢迎继续在本平台咨询。
目前新的浏览器都是禁止服务器通过客户端脚本获取完整路径的。
您可以在火狐社区了解更多内容。希望我的回答对您有所帮助，如有疑问，欢迎继续在本平台咨询。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
