javascript - 在 .NET WebForms 中使用 jquery 触发简单的 onchange 方法

Question

当用户尝试上传图像时，我试图触发一个简单的事件/图像预览，预览后(裁剪和编辑它，他将单击“保存”)。到目前为止我所做的和正在尝试的如下:

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script>
        $(document).ready(function () {
           function  loadImage(event) {
                var output = $('#<%=FileUpload1.ClientID%>').val();
                output.src = URL.createObjectURL(event.target.files[0]);
            };
        }); 
    </script>
</asp:Content>

在 HTML 端，我有如下文件上传控件:

<asp:FileUpload ID="FileUpload1" onchange="loadImage(this)" runat="server"  /></div>

但是当我尝试选择图像时出现错误:

Uncaught ReferenceError: loadImage is not defined(…)

我做错了什么？

Answer 1

删除 $.ready 调用，因为您只是定义函数。

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script>
           function  loadImage(event) {
                var output = $('#<%=FileUpload1.ClientID%>').val();
                output.src = URL.createObjectURL(event.target.files[0]);
            };
    </script>
</asp:Content>