<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
var picPath;
var image;
function preview() {
document.getElementById('preview').style.display = 'none';
alert(picPath);
document.getElementById('box').innerHTML = "<img width='" + image.width + "' height='" + image.height + "' id='aPic' src='" + picPath + "'>";
}
function buttonShow() {
if (image.width == 0 || image.height == 0) {
setTimeout(buttonShow, 1000);
} else {
document.getElementById('preview').style.display = 'block';
}
}
function loadImage(ele) {
picPath = getPath(ele);
image = new Image();
image.src = picPath;
setTimeout(buttonShow, 1000);
}
function getPath(obj) {
if (obj) {
if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
obj.select();
return document.selection.createRange().text;
}
else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
if (obj.files) {//判断是否有文件
return obj.files.item(0).getAsDataURL();
}
return obj.value;
}
return obj.value;
}
}
</script>
</head>
<body>
<input type="file" name="pic" id="pic" οnchange='loadImage(this)' /><br />
<input id="preview" type="button" value="preview" style="" οnclick="preview()" />
<div id='box'>
</div>
</body>
</html>