如何使FileUpload控件在点击'浏览'后立即上传文件

本文关键字：文件 浏览 何使 FileUpload 控件 | 更新日期: 2023-09-27 18:07:39

到目前为止，我一直在使用2个控件(FileUpload和附加按钮)。

在fileUpload控件中选择文件后，用户必须按保存键接受他的选择。

按钮代码:

    protected void Button1_Click(object sender, EventArgs e)
    {
        if (FileUpload1.HasFile)
        {
            FileUpload1.SaveAs(Server.MapPath("~/file.jpg"));
            Label1.Text = Server.MapPath("~/file.jpg");
            Image1.ImageUrl = "file.jpg";
        }
    }

我想知道是否有一种方法来避免使用该按钮，所以FileUpload控件的按钮会做额外的按钮的工作。

如何使FileUpload控件在点击'浏览'后立即上传文件

FileUpload控件在浏览器中呈现<input type="file>。可以使用javascript的change事件触发上传。

首先确保在页面的body中注册了load事件处理程序:

<body onload="body_onload()">

并在事件处理程序中添加以下代码:

<script type="text/javascript">
    function body_onload()
    {
        ...
        $get('<%=FileUpload.ClientID%>').onchange = function() { 
            $get('<%=this.Page.Form.ClientID%>').submit(); 
        };
    }
</script>

或者使用纯jQuery，把它放在你的页面的head(如果你还没有包含jQuery):

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

然后使用此代码绑定到事件(将#fileUpload1和#form1分别替换为FileUpload和Form元素的id):

<script type="text/javascript">
    $(document).ready(function() {
        $("#fileUpload1").change(function() {
            $("#form1").submit();
        });
    });
</script>
相关文章：