Javascript无法正常工作(textbox.value = fileupload.value)

时间:2012-05-11 09:38:23

标签: javascript asp.net html css

代码的想法是创建一个单独的文本框和按钮,这样我就可以为每个创建类,并使它们像fileupload一样工作。

但javascript运行两次,fileupload值被删除。

<style type="text/css">
div.fileinputs
{
    position: relative;
}

div.fakefile
{
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}

input.file
{
   visibility:hidden;
}
</style>
<script type="text/javascript" language="javascript">
    function uploadFileChange() {
            alert("start");
            document.getElementById('FileName').value = document.getElementById("FileUpload1").value;
            alert("end");
    }
</script>
<div class="fileinputs" style="width: 50%;">
    <!-- Upload file invisivel-->
    <asp:FileUpload ID="FileUpload1" ClientIDMode="Static" class="file" runat="server" 
         onpropertychange="uploadFileChange();"  />
    <!-- button e textbox falsas para poder dar syles ao button-->
    <div class="fakefile">
        <asp:TextBox ID="FileName" CssClass="textbox" ClientIDMode="Static" runat="server" Width="31%" ></asp:TextBox>
        <asp:Button ID="FileChooserButton1" CssClass="btnSubmit" runat="server" Text="Procurar..."
            ForeColor="White" onClick="document.getElementeByID('FileUpload1').click()" />
    </div>
</div>

怎么了? 提前致谢

1 个答案:

答案 0 :(得分:1)

对您的代码进行少许更正,

<asp:Button ID="FileChooserButton1" CssClass="btnSubmit" runat="server" Text="Procurar..."             ForeColor="White" onClientClick="document.getElementeByID('FileUpload1').click();return false;" />

将回复false写入clickevent将不会回发,之所以丢失fileuplaod值是因为该页面正在获得帖子支持。

或者你可以试试这个,

<asp:Button ID="FileChooserButton1" CssClass="btnSubmit" runat="server" Text="Procurar..." ForeColor="White" onClientClick="CallClick();return false;" />

function CallClick(){
document.getElementeByID('FileUpload1').click();
return false;
}