【JavaScript】动态添加控件_document 中没有动态创建的控件-优快云博客

本文将介绍如何使用JavaScript动态生成文件浏览框，包括插入新行、添加文件浏览输入框和删除按钮的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

    <script type="text/javascript">
        //<!--动态添加文件浏览框函数-->
        function insertElement() 
            {
                //找到放置动态生成的文件框的表格 
                var otablefile = document.getElementById("txttable");
                //添加一个新行
                var otr = otablefile.insertRow(0);
                //在新行中添加一个单元格，单元格中包含一个文件浏览框和一个删除按钮
                otr.insertCell(0).innerHTML = "单项名字";
                otr.insertCell(1).innerHTML = "<input type=text name=usertxt[] style='width:150px'>";
                otr.insertCell(2).innerHTML = "<input type=button value='删除' onclick='javascript:deltr(this);'>";
            }
        //<!--删除动态增加的文件框-->  
        function deltr(obj)
        {
                //删除当前所在的行
                obj.parentElement.parentElement.removeNode(true);
        }
    </script>




<table border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td>
            <table id="txttable" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td>
                        单项名字
                    </td>
                    <td>
                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                    </td>
                </tr>
            </table>
        </td>                                        
    </tr>
    <tr>
        <td align="right">
            <input id="Button1" onclick="insertElement();" type="button" value="button" />
        </td>
    </tr>
</table>


Request.Form["usertxt[]"]