怎样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控件选择图片实例教程的详细内容。