ASP.NET图片预览功能中遇到的脚本问题

我在ASP.NET里做个图片预览的功能,从网上找了段JS脚本,脚本如下:
<script type="text/javascript"> 
function onUploadImgChange(sender){   
    if( !sender.value.match( /.jpg|.gif|.png|.bmp/i ) ){   
        alert('图片格式无效！');   
        return false;   
    }   
       
    var objPreview = document.getElementById( 'preview' );   
    var objPreviewFake = document.getElementById( 'preview_fake' );   
    var objPreviewSizeFake = document.getElementById( 'preview_size_fake' );   
       
    if( sender.files && sender.files[0] ){   
        objPreview.style.display = 'block';   
        objPreview.style.width = 'auto';   
        objPreview.style.height = 'auto';   
           
        // Firefox 因安全性问题已无法直接通过 input[file].value 获取完整的文件路径   
        objPreview.src = sender.files[0].getAsDataURL();       
    }else if( objPreviewFake.filters ){    
        // IE7,IE8 在设置本地图片地址为 img.src 时出现莫名其妙的后果   
        //（相同环境有时能显示，有时不显示），因此只能用滤镜来解决   
           
        // IE7, IE8因安全性问题已无法直接通过 input[file].value 获取完整的文件路径   
        sender.select();   
        var imgSrc = document.selection.createRange().text;   
           
        objPreviewFake.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;//执行到该行时脚本报错,不知道什么原因   
        objPreviewSizeFake.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;   
           
        autoSizePreview( objPreviewFake,    
            objPreviewSizeFake.offsetWidth, objPreviewSizeFake.offsetHeight );   
        objPreview.style.display = 'none';   
    }   
}  function onPreviewLoad(sender){   
    autoSizePreview( sender, sender.offsetWidth, sender.offsetHeight );   
}  function autoSizePreview( objPre, originalWidth, originalHeight ){   
    var zoomParam = clacImgZoomParam( 300, 300, originalWidth, originalHeight );   
    objPre.style.width = zoomParam.width + 'px';   
    objPre.style.height = zoomParam.height + 'px';   
    objPre.style.marginTop = zoomParam.top + 'px';   
    objPre.style.marginLeft = zoomParam.left + 'px';   
}  function clacImgZoomParam( maxWidth, maxHeight, width, height ){   
    var param = { width:width, height:height, top:0, left:0 };   
       
    if( width>maxWidth || height>maxHeight ){   
        rateWidth = width / maxWidth;   
        rateHeight = height / maxHeight;   
           
        if( rateWidth > rateHeight ){   
            param.width = maxWidth;   
            param.height = height / rateWidth;   
        }else{   
            param.width = width / rateHeight;   
            param.height = maxHeight;   
        }   
    }   
       
    param.left = (maxWidth - param.width) / 2;   
    param.top = (maxHeight - param.height) / 2;   
       
    return param;   
}   
</script>当执行到 objPreviewFake.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;时脚本报错,
报错为
错误:未指明的错误,我认为这段脚本应该是没有问题的,以前是在一个测试中用过的,现在我把它移植到一个使用母版的系统中,放在内容页里就报错了,希望有遇到过这个问题的大侠们给以解答.

解决方案 »

  1.   

    当加入母版页后。。有部分控件的ID会发生变化。。比如上传控件。。ID一定会变的。。所以加入母版页后JS代码的ID要重新对照一下。。方法：运行页面----->查看源码再自己对照控件ID
      

  2.   


    function ShowUpLoadPic()
            {
                var fileName=documnet.getElementById("myFile").value;
                if(fileName=="")           
                    return;
                var exName=fileName.substr(fileName.lastIndexOf(".")+1).toUpperCase()
                //alert(exName)
                if(exName=="JPG"||exName=="BMP"||exName=="GIF")
                {
                    documnet.getElementById("ImgPhoto").src=fileName
                }
                else
                {
                    alert("请选择正确的图片文件")
                    documnet.getElementById("myFile").value=""
                } 
            }
      

  3.   

    汗，楼主找出答案也不贴出来，找了两天，终于找到错误所在了
     
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="YC.SH.WEB.PictureCompare.WebForm1" %><!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>
        <style type="text/css">
            #image
            {
                progid: DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);
            }
        </style>    <script type="text/javascript">
            function Preview(imgFile) {
                //            var divimage = document.createElement("div");
                var fileUrl = imgFile.value;
                var divimage = document.getElementById("image");
                divimage.style.width = "400px";
                divimage.style.height = "400px";
                //            document.appendChild(divimage);
                divimage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale;)";
                divimage.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgFile.value;
            }
        </script></head>
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:FileUpload ID="FileUpload1" runat="server" Width="221px" onchange="Preview(this)" />
            <div id="image">
                这里是显示图片的地方</div>
        </div>
        </form>
    </body>
    </html>