.net 上传图片预览功能,该如何处理
日期：2014-05-17 浏览次数：20404 次
.net 上传图片预览功能
如题，为什么我的图片选择之后看不到图片的预览呢，现在我贴上代码，请各位指导一下
<td align="left">
<asp:FileUpload ID="image_file" runat="server" onchange="previewpic(this)" Height="21px" Width="188px" />
<br />
<script type="text/javascript">
function previewpic(obj) {
var preview = document.getElementById("preView");
preview.src = obj.value;
}
</script>
<img id="preView" style="width: 165px; height: 119px" /> </td>
------解决方案--------------------
这种方式预览 只有IE6浏览器才可以，更高版本或者FIREFOX都不能预览。用滤镜的话IE7可以预览，但更好版本或者FIREFOX也不能预览
------解决方案--------------------
还是考虑使用Jqaury flash的方式来实现上传预览吧
------解决方案--------------------
怎么没高级回复了。
------解决方案--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<base target="_self"/>
<script type="text/javascript" src="../Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
(function ($) {
$.fn.PreviewImage = function (options) {
var Default = {
ImageClientId: "",
MaxWidth:500,
MaxHeight: 400
};
$.extend(true, Default, options);
return this.each(function () {
if (Default.ImageClientId != "") {
$(this).unbind("change");
$(this).change(function () {
if ($(this).val() == "") {
$("#" + Default.ImageClientId).parent("div").hide();
return;
}
else {
$("#" + Default.ImageClientId).parent("div").show();
}
if ($.browser.msie) {
$("#" + Default.ImageClientId).attr("src", $(this).val());
}
else {
$("#" + Default.ImageClientId).attr("src", $(this)[0].files[0].getAsDataURL());
}
if ($.browser.msie && $.browser.version > 6) {
$("#" + Default.ImageClientId).hide();
$("#" + Default.ImageClientId).parent("div").css({
'z-index': '999',
'filter': 'progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)',
'max-width': Default.MaxWidth + 'px', 'max-height': Default.MaxHeight + 'p
如题，为什么我的图片选择之后看不到图片的预览呢，现在我贴上代码，请各位指导一下
<td align="left">
<asp:FileUpload ID="image_file" runat="server" onchange="previewpic(this)" Height="21px" Width="188px" />
<br />
<script type="text/javascript">
function previewpic(obj) {
var preview = document.getElementById("preView");
preview.src = obj.value;
}
</script>
<img id="preView" style="width: 165px; height: 119px" /> </td>
------解决方案--------------------
这种方式预览 只有IE6浏览器才可以，更高版本或者FIREFOX都不能预览。用滤镜的话IE7可以预览，但更好版本或者FIREFOX也不能预览
------解决方案--------------------
还是考虑使用Jqaury flash的方式来实现上传预览吧
------解决方案--------------------
怎么没高级回复了。
------解决方案--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<base target="_self"/>
<script type="text/javascript" src="../Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
(function ($) {
$.fn.PreviewImage = function (options) {
var Default = {
ImageClientId: "",
MaxWidth:500,
MaxHeight: 400
};
$.extend(true, Default, options);
return this.each(function () {
if (Default.ImageClientId != "") {
$(this).unbind("change");
$(this).change(function () {
if ($(this).val() == "") {
$("#" + Default.ImageClientId).parent("div").hide();
return;
}
else {
$("#" + Default.ImageClientId).parent("div").show();
}
if ($.browser.msie) {
$("#" + Default.ImageClientId).attr("src", $(this).val());
}
else {
$("#" + Default.ImageClientId).attr("src", $(this)[0].files[0].getAsDataURL());
}
if ($.browser.msie && $.browser.version > 6) {
$("#" + Default.ImageClientId).hide();
$("#" + Default.ImageClientId).parent("div").css({
'z-index': '999',
'filter': 'progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)',
'max-width': Default.MaxWidth + 'px', 'max-height': Default.MaxHeight + 'p
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
