Demo如下
<!DOCTYPE html>
<html>
<head>
<title>上传图片预览</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="./jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#input").change(function(){
alert(1);
var files = $(this).prop('files');
var old_img = "<{$row.img}>";
if(files[0]){
var objUrl = getObjectURL(files[0]);
if(objUrl!=''){
$(".img_tr").show();
$(".img_show").attr("src",objUrl);
}
}
});
})
function getObjectURL(file){
var url = null;
if(window.createObjectURL!=undefined){
url = window.createObjectURL(file);
}else if(window.URL!=undefined){
url = window.URL.createObjectURL(file);
}else if(window.webkitURL!=undefined){
url = window.webkitURL.createObjectURL(file);
}
return url ;
}
</script>
</head>
<body>
<h3>请选择图片文件:JPG/GIF</h3>
<table cellpadding="0" cellspacing="0">
<form action="javascript:;" enctype="multipart/form-data">
<tr>
<td>上传主图片:</td>
<td>
<a href="javascript:;" style="position:relative;">
<input id="input" type="file" name="img" />
</a>
</td>
</tr>
<tr class="img_tr" >
<td class="tableleft">主图片预览:</td>
<td class="tableright"><img class="img_show" src="" style="width:130px;height:110px;" /></td>
</tr>
</form>
</table>
</body>
</html>