<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>上传照片</title>
<style type="text/css">
#tabkePhoto{display:none;}
.photo{}
.imgBox{width:200px;height:200px;}
</style>
<!--[if lte IE 7]>
<style type="text/css">
#tabkePhoto{display:block;}
</style>
<![endif]-->
<!--[if lte IE 8]>
<style type="text/css">
#tabkePhoto{display:block;}
</style>
<![endif]-->
<!--[if lte IE 9]>
<style type="text/css">
#tabkePhoto{display:block;}
</style>
<![endif]-->
<script type="text/javascript" src="../jquery-1.11.3/jquery.min.js"></script>
</head>
<body>
<label class="photo" for="tabkePhoto">点击上传</label>
<input id="tabkePhoto" type='file'>
<div class="imgBox">
</div>
<script type="text/javascript">
$(function(){
$('#tabkePhoto').change(function(e){
var _suffix = $(this).val().substr(Number($(this).val().indexOf('.'))+1).toUpperCase();
if(this.files && this.files[0]){
var _file = this.files[0],
imgUrl = new FileReader();
imgUrl.readAsDataURL(_file);
imgUrl.onload = function(){
if(!(_suffix =='JPG' || _suffix == 'PNG'|| _suffix == 'JPEG'|| _suffix=='TIFF'|| _suffix=='BMP')){
alert('骚年，格式好像不对吧！你换张试试');
}else{
var _html = '<img src="'+this.result+'">';
$('.imgBox').html(_html);
}
}
}else{
$(this).select();
var _src = document.selection.createRange().text;
if(!(_suffix =='JPG' || _suffix == 'PNG'|| _suffix == 'JPEG'|| _suffix=='TIFF'|| _suffix=='BMP')){
alert('骚年，格式好像不对吧！你换张试试');
}else{
var _html = '<img src="'+_src+'">';
$('.imgBox').html(_html);
}
}
})
})
</script>
</body>
</html>
