button+textbox另类FileUpload控件给变量赋值

来源：互联网发布：西门子840d循环编程编辑：程序博客网时间：2024/06/05 15:36

使用了这个控件的朋友们想必都知道FileUpload无法给变量赋值。当我们需要将数据库中的文件名呈现在这个控件上时，FileUpload控件在这一点上显得苍白无力。所以就需要重辟新路完成这个FileUpload控件无法完成的功能。

原理：button + textbox组合，伪装一个FileUpload。通过button点击触发隐藏的FileUpload点击事件弹出选择对话框，然后FileUpload的onpropertychange事件监视value的改变。在value改变时JS给textbox赋值。

cs代码：

using System;using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;public partial class FTPCoding_Default : System.Web.UI.Page{    protected void Page_Load(object sender, EventArgs e)    {        if (!IsPostBack)        {            this.FileUpload1.Attributes.Add("style", "display:none");//先将控件隐藏             this.FileUpload1.Attributes.Add("onpropertychange", "UploadOnpropertychange()");//监视属性变化，此时主要用于捕捉文件路径的写入值        }    }}

页面代码：

<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title>无标题页</title>    <script type="text/javascript" language="javascript">        function UploadOnpropertychange()        {            //JS获取上传控件的值，即所上传文件的绝对路径            var varUploadFile = document.getElementByIdx("FileUpload1").value;            //将路径值通过split函数切割分成一个数组集合            //使用这个函数，这个地方主要是为了获取文件名            var varArray = varUploadFile.split('\\');                       //测试//            for (var i = 0;i < varArray.length;i++)//            {//                if (i == varArray.length - 1)//                {//                    alert(varArray[i]);//                }//            }            //最后将所需要的文件名赋给文本框            document.getElementByIdx("txtUploadFile").value = varArray[varArray.length - 1];        }    </script></head><body>    <form id="form1" runat="server">        <div>            <asp:TextBox ID="txtUploadFile" runat="server"></asp:TextBox>            <input type="button" value="测试" onclick="javascript:document.getElementByIdx('FileUpload1').click();" />            <asp:FileUpload ID="FileUpload1" runat="server" CssClass="cssfile" />        </div>    </form></body></html>