日期:2014-05-17  浏览次数:21160 次

Js+Css实现图片上传预览功能
<style type="text/css">
        #newPreview{
            FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)
        }
    </style>
function showPreview(imgFile) {

            var newPreview = document.getElementById("newPreview"); alert(document.getElementById("<%=filePic.ClientID %>").value);
            newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgFile.value;
            newPreview.style.width = "130px";
            newPreview.style.height = "75px";
            document.getElementById("<%=imgAD.ClientID %>").style.display = "none";
        }
以下是页面代码:
<td style="border-bottom: none; width: 100px">
                                                    <div id="newPreview">
                                                        <asp:Image ID="imgAD" runat="server"  Width="130px" Height="75px" />
                                                    </div>
                                                </td>
                                                <td style="border-bottom: none;">
                                                    <asp:FileUpload ID="filePic" runat="server" ToolTip="上传图片" onchange="showPreview(this)" />
                                                </td>
JS获取filePic的value值不是图片上传的路径,变成
C:\fakepath\05.jp