您好,欢迎访问一九零五行业门户网

file控件选择图片实例教程

怎样fileupload控件浏览选择图片的时候在img上同时显示出来(不用按上传) 下面代码能实现:
这个我也找过很长时间,  我把我的给你你再试一下吧。
js部分:
<script type="text/javascript"> function showimg(obj) { var allowext = ".jpg|.gif|.bmp|.png|"; var fileext = obj.value.substr(obj.value.lastindexof(".")).tolowercase(); if (allowext != 0 && allowext.indexof(fileext + "|") == -1) //判断文件类型是否允许上传 { alert("您上传的不是图片!"); } else { var newpreview = document.getelementbyid("previewimg2"); newpreview.src = obj.value; } } </script>
body部分内容:
<img id="previewimg2" alt="" src="" width="140px" height="115px" /> <asp:fileupload id="fileupload1" runat="server" onchange="showimg(this)" />
这个方法是我亲自测试的,可以使用,希望对你有帮助!如果可行别忘了点 赞 哦!!!
代码如下:
<script>$(function() { $("#book_fiel").change(function() {var $file = $(this);var fileobj = $file[0];var windowurl = window.url || window.webkiturl;var dataurl;var $img = $("#book_picture");if (fileobj && fileobj.files && fileobj.files[0]) { dataurl = windowurl.createobjecturl(fileobj.files[0]); $img.attr('src', dataurl); } else { dataurl = $file.val();var imgobj = document.getelementbyid("preview");// 两个坑:// 1、在设置filter属性时,元素必须已经存在在dom树中,动态创建的node,也需要在设置属性前加入到dom中,先设置属性在加入,无效;// 2、src属性需要像下面的方式添加,上面的两种方式添加,无效;imgobj.style.filter = "progid:dximagetransform.microsoft.alphaimageloader(sizingmethod=scale)"; imgobj.filters.item("dximagetransform.microsoft.alphaimageloader").src = dataurl; } }); } ); </script>
以上就是file控件选择图片实例教程的详细内容。
其它类似信息

推荐信息