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