使用HMTL5 FileReader 处理上传图片的预览，以下代码已经在IE7，8,9,firefox 21.0,chrome浏览器下测试通过
如想了解更多HTML5
请参看： http://hushc.sinaapp.com//post/27
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title> New Document </title><meta name="Generator" content="EditPlus"><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Description" content=""><script type="text/javascript" src='jquery.js'></script><script type="text/javascript">
$(function() {
var path,
clip = $("#img"),
FileReader = window.FileReader;
$("#fileP").change(function() {
if (FileReader) {
var reader = new FileReader(),
file = this.files[0];
reader.onload = function(e) {
clip.attr("src", e.target.result);
};
reader.readAsDataURL(file);
}
else {
path = $(this).val();
if (/"\w\W"/.test(path)) {
path = path.slice(1,-1);
}
clip.attr("src",path);
}
});
});</script></head><body><input type="file" id="fileP"><img id="img" src=""></body></html>
- 本文附件下载:
- jquery.rar (71.6 KB)
已有 0人发表留言，猛击->> 这里<<-参与讨论
ITeye推荐
