以http协议开头的url的网页，即服务器上的网页是不能显示计算机本地图片的。
如果想查看本地图片但不使用服务端的上传功能，可以使用html5的fileReader实现。
（IE10以下的浏览器不支持这个功能）
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>html5 fileReader</title>
</head>
<style type="text/css">
*{margin: 0;padding: 0;}
input{margin: 20px 0 10px 20px;}
.preview{margin-left: 20px;width: 300px;height: 300px;border: 1px solid #ccc;overflow: hidden;}
.preview img{width: 100%;height: 100%;}
</style>
<body>
<input type="file"/>
<div class="preview"></div>
</body>
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
function dataURLPreview(file) {
var img = new Image(),
url = img.src = URL.createObjectURL(file);
img.onload = function() {
URL.revokeObjectURL(url);
$(‘.preview‘).empty().append($(img));
};
}
$(‘input[type=file]‘).change(function(e) {
var file = e.target.files[0];
dataURLPreview(file);
});
</script>
</html>
时间： 2024-08-07 20:32:39