浏览器 本地预览图片 window.url.createobjecturl

第一种方式

1. <script type="text/javascript">
2. function setImagePreview() {
3. var docObj = document.getElementById("ctl00_ContentMain_file_head");
4. var fileName = docObj.value;
5. if (!fileName.match(/.jpg|.gif|.png|.bmp/i)) {
6. alert('您上传的图片格式不正确，请重新选择！');
7. return false;
8. }
10. var imgObjPreview = document.getElementById("preview");
11. if (docObj.files && docObj.files[0]) {
12. //火狐下，直接设img属性
13. imgObjPreview.style.display = 'block';
14. imgObjPreview.style.width = '63px';
15. imgObjPreview.style.height = '63px';
16. //imgObjPreview.src = docObj.files[0].getAsDataURL();
17. if (window.navigator.userAgent.indexOf("Chrome") >= 1 || window.navigator.userAgent.indexOf("Safari") >= 1) {
18. imgObjPreview.src = window.webkitURL.createObjectURL(docObj.files[0]);
19. }
20. else {
21. imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
22. }
23. } else {
24. //IE下，使用滤镜
25. docObj.select();
26. docObj.blur();
27. var imgSrc = document.selection.createRange().text;
28. var localImagId = document.getElementById("localImag");
29. //必须设置初始大小
30. localImagId.style.width = "63px";
31. localImagId.style.height = "63px";
32. //图片异常的捕捉，防止用户修改后缀来伪造图片
33. try {
34. localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
35. localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
36. } catch (e) {
37. alert("您上传的图片格式不正确，请重新选择！");
38. return false;
39. }
40. imgObjPreview.style.display = 'none';
41. document.selection.empty();
42. }
43. return true;
44. }
46. </script>

<div id="localImag"><img id="preview" width="-1" height="-1" style="display:none" /></div> 
<asp:FileUpload ID="file_head" runat="server" οnchange="javascript:setImagePreview();" /> 

第二种方式

1. function setImagePreview(a,b) {
2. var url ='';
3. if (navigator.userAgent.indexOf("MSIE")>=1) { // IE
4. url = document.getElementById(a).value;
5. } else if(navigator.userAgent.indexOf("Firefox")>0) { // Firefox
6. url = window.URL.createObjectURL(document.getElementById(a).files.item(0));
7. } else if(navigator.userAgent.indexOf("Chrome")>0) { // Chrome
8. url = window.URL.createObjectURL(document.getElementById(a).files.item(0));
9. }
10. var imgPre = document.getElementById(b);
11. imgPre.src = url;
12. }

a = fileid

b=imgid

转载于:https://www.cnblogs.com/signheart/p/6599802.html