首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > asp.net >

关于JS动态生成input,后台获取值的有关问题

2013-09-12 
关于JS动态生成input,后台获取值的问题script typetext/javascriptfunction Creat() {var textBoxId

关于JS动态生成input,后台获取值的问题


<script type="text/javascript">
    function Creat() {
        var textBoxId = document.createElement("input");
        textBoxId.nodeType = "text";
        textBoxId.nodeName = "textBoxId1";
        document.getElementById("GoodsBox").appendChild(textBoxId);
    }
</script>



 <div>
    <form action="Default2.aspx" method="post" id="GoodsBox">
        <input type="submit" value="提交" />
    </form>
    <input type="button" onclick="Creat()" value="创建" />
    </div>


很简单..点击创建按钮..调用Creat方法..

Creat方法就是生成一个input元素,type=text 也就是文本框,然后name=textBoxId1

然后再添加到form里面...

问题点击创建..文本框是出来了..但是提交后..Request.Form["textBoxId1"]竟然为null..这到底是为什么?

还有没有别的方法动态生成文本框,然后后台能获取值的 js
[解决办法]
textBoxId.setAttribute("type", "text"); 
textBoxId.setAttribute("name", "textBoxId1"); 
[解决办法]
好吧,我把完整的例子发一下。你参考一下。
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script type="text/javascript">
        function Creat() {
            var textBoxId = document.createElement("input");
            textBoxId.setAttribute("type", "text");
            textBoxId.setAttribute("id", "textBoxId1");
            document.getElementById("GoodsBox").appendChild(textBoxId);
        }


        function Test() {
            document.getElementById("Hidden1").value = document.getElementById("textBoxId1").value;
            document.getElementById("<%=HiddenField1.ClientID%>").value = document.getElementById("textBoxId1").value;
        }
    </script>

</head>
<body>
    <div>
        <form runat="server" id="GoodsBox">
            <input type="submit" value="提交" />
            <input type="button" onclick="Creat()" value="测试创建" />
            <input type="button" onclick="Test()" value="测试获取值" />
            <input id="Hidden1" name="Hidden1" type="hidden" value="" />
            <asp:HiddenField ID="HiddenField1" runat="server" Value="" />
            <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
        </form>
    </div>
</body>
</html>


WebForm1的Button1_Click事件。
  protected void Button1_Click(object sender, EventArgs e)
        {
            Response.Write("<script> alert('" + HiddenField1.Value + "') </script>");
        }

效果:
点测试创建,再点测试获取值,最后点Button。就可以弹出你在动态加的textbox中输入的文字了。

热点排行