FileUpload控件修改

FileUpload正常格式是一个文本框加一个按钮，但是我们有时候会想要自定义按钮的样式，那么我们就需要隐藏一个FileUpload控件，然后自己加一个按钮，点击这个按钮选择上传文件，这里有个地方要注意，FileUpload出于安全考虑，如果是其他按钮触发的他的onclick事件，选择的文件，是无法通过验证的，submit会失败。所以，不能用其他按钮触发FileUpload控件的onclick事件。

那么就要求我们，做的效果是，点击自己添加的按钮，但实际是点击的FileUpload控件的按钮。思路是用自定义显示的覆盖在FileUpload控件上，但是发生点击时，点击的是FileUpload控件。

下面的代码可以实现，至于FileUploadSubmit()这个方法，是选择文件后，触发的js事件，这时候就可以提交服务器了

            <input type="text" id="txt" name="txt">
            <input type="button" onmousemove="FileUploadImage.style.pixelLeft=event.x-60;FileUploadImage.style.pixelTop=this.offsetTop;"
                value="请选择文件" size="30">
            <asp:FileUpload ID="FileUploadImage" runat="server" onchange="txt.value=this.value;FileUploadSubmit()"
                Style="position: absolute; filter: alpha(opacity=0);" size="1" hidefocus />

如果是IE9的话，换成下面代码

            <input type="text" id="txt" name="txt">
            <input type="button" onmousemove="FileUploadImage.style.pixelLeft=event.x-60;FileUploadImage.style.pixelTop=this.offsetTop+17;"
                value="请选择文件" size="30">
            <asp:FileUpload ID="FileUploadImage" runat="server" Width=50 onchange="txt.value=this.value;FileUploadSubmit()"
                Style="position: absolute; filter: alpha(opacity=0);" size="1" hidefocus />

因为ie9的相对位置好像不对，可以把filter: alpha(opacity=0);这个删掉，就能看到效果了。