ASP.NET 使用FileUpload與Image做出預覽效果

HTML
<tr>
<td class="leftTD">上傳圖片</td>
<td style="width:5%"><asp:FileUpload ID="ImageFileUpload" runat="server" Font-Names="微軟正黑體" onchange="previewFile()" Width="150px"/></td>
<td class="rightTD"><asp:Image ID="Preview" ImageUrl="~/_thumbs/Images/news/none.gif" runat="server" Width="80" Height="80" /></td>
</tr>
 
JavaScript
 
    function previewFile() {
    var preview = document.querySelector('#<%=Preview.ClientID %>');
    var file = document.querySelector('#<%=ImageFileUpload.ClientID %>').files[0];
    var reader = new FileReader();

    reader.onloadend = function () {
        preview.src = reader.result;
    }

    if (file) {
        reader.readAsDataURL(file);
    } else {
        preview.src = "";
    }
}