<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
  <title></title>   
  <script type="text/javascript" language="JavaScript">   
  function ShowDiv()
  {   
  if (!document.getElementById("newdiv"))
  {
  var ndiv = document.createElement("div");
  ndiv.id="newdiv";
  ndiv.style.top="50px";
  ndiv.style.left="50px";
    
  var Obj = document.getElementById("div2").parentNode;
  Obj.appendChild(ndiv);
  }
    
  var X=document.getElementById("newdiv");
  X.innerHTML = document.getElementById("div2").innerHTML;
X.getElementsByTagName("input")[0].name="TextBox2"
  }
    
  </script>   
</head>
<body >
  <form id="form1" runat="server">   
  <div id="div1" >   
  <input id="Button1" type="button" value="button1" onclick="ShowDiv()" />   
  </div>
    
  <div id="div2">  
  <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>   
  <asp:Button ID="Button2" runat="server" Text="Button2" />
  </div>
    
  </form>
</body>
</html>
以上是代码,能动态增加一个文本框,现要求能增加5个文本框,点一次,增加一个,然后还有,这样出现的动态文本框,如何取值,跟普通的一样么?

解决方案 »

  1.   

    在JS里面取吧?一样的,通过ID来取即可,document.getElementById
      

  2.   

    给它个ID,用JS一样取值的,页面放个Hiddenfield,然后提交按键加个onclientclick
    var txtlist = document.getElementsByTagName("input");
    var names = "";
    for(var i=0;i<txtlist.length;i++){
       names+=txtlist.value+","; //把value值组合,并以','分割
    }
    //将所有的name值放入隐藏域(id=subName,name=subName)
    document.getElementById("subName").value=names; --------action----------------
    String values = request.getParameter("subName");
    String value [] = values.split(","); //这里就是所有的值了
      

  3.   

    <%@ Page Language="C#" AutoEventWireup="true" Codebehind="WebForm6.aspx.cs" Inherits="Slife.Example.UI.salimTest.WebForm6" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>无标题页</title>    <script type="text/javascript" language="JavaScript">   
        var index=1;
        function ShowDiv()
        {   
           if(index<5)
           { 
                var divId= "newdiv"+index;
                var ndiv = document.createElement("div");
                ndiv.id=divId;
                ndiv.style.top="50px";
                ndiv.style.left="50px";
                var Obj = document.getElementById("divEmailS"); 
                Obj.appendChild(ndiv);
                var X=document.getElementById(divId);
                X.innerHTML = "<input type='text' id='txtEmail"+index+"'/>";
                index++;
           } 
        }
        </script></head>
    <body>
        <form id="form1" runat="server">
            <div id="div1">
                <input id="Button1" type="button" value="button1" onclick="ShowDiv()" />
            </div>
            <div id="divEmailS">
                <div id="div2">
                    <input type="text" id="newdiv" />
                </div>
            </div>
        </form>
    </body>
    点一个增加一个,我下班了。。删除还没给你至于取值很简单的
      

  4.   


    <head id="Head1" runat="server">
        <title>无标题页</title>    <script type="text/javascript" language="JavaScript">   
        var index=1;
        function ShowDiv()
        {   
           if(index<6)
           { 
                var divId= "newdiv"+index;
                var ndiv = document.createElement("div");
                ndiv.id=divId;
                ndiv.style.top="50px";
                ndiv.style.left="50px";
                var Obj = document.getElementById("divEmailS"); 
                Obj.appendChild(ndiv);
                var X = document.getElementById(divId);
                X.innerHTML = "<input type='text' id='txtEmail" + index + "'/><input type='button' id='button" + index + "' value='button" + index + "'/>";
                var textid = "txtEmail" + index;
                var buttonid = "button" + index;
                document.getElementById(buttonid).onclick = function() {
                    var text = document.getElementById(textid).value;
                    alert(text);
                }
                index++;
           } 
        }
        </script></head>
    <body>
        <form id="form1" runat="server">
            <div id="div1">
                <input id="ButtonX" type="button" value="buttonX" onclick="ShowDiv()" />
            </div>
            <div id="divEmailS">
                <div id="div2">
                    <input type="text" id="newdiv" />
                </div>
            </div>
        </form>
    </body>
      

  5.   

    <%@ Page Language="C#" AutoEventWireup="true" Codebehind="WebForm6.aspx.cs" Inherits="Slife.Example.UI.salimTest.WebForm6" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>无标题页</title>    <script type="text/javascript" language="JavaScript">   
        var index=1;
        function ShowDiv()
        {   
           if(index<6)
           { 
                var divId= "newdiv"+index;
                var ndiv = document.createElement("div");
                ndiv.id=divId;
                ndiv.style.top="50px";
                ndiv.style.left="50px";
                var Obj = document.getElementById("divEmailS"); 
                Obj.appendChild(ndiv);
                var X=document.getElementById(divId);
                X.innerHTML = "<input type='text' id='txtEmail"+index+"'/><a href='javascript:void(0)' id='aDel"+index+"' onclick='CloseDiv(\""+divId+"\",\"aDel"+index+"\")'>删除</a>";
                index++;
           } 
        }
        function CloseDiv(target,atar)
        {
           var txtin = document.getElementById(target); 
           var adel = document.getElementById(atar);
           txtin.parentNode.removeChild(txtin); //下面效果相同  
           adel.parentNode.removeChild(adel); //下面效果相同  
            index--; 
        }
        </script></head>
    <body>
        <form id="form1" runat="server">
            <div id="div1">
                <input id="Button1" type="button" value="button1" onclick="ShowDiv()" />
            </div>
            <div id="divEmailS">
                <input type="text" id="newdiv" />
            </div>
        </form>
    </body>
    </html>
    添加删除功能都OK的,6楼道就只是添加了以个按钮,但是没用JS实现功能!!!
      

  6.   

    function getValue()
        {
           var Obj = document.getElementById("divEmailS"); 
           var  txtall = Obj.getElementsByTagName("input");
           var txtShow =  document.getElementById("txtAddress"); 
           if(txtall.length>1) 
           {
               var temp;
               for(i=0;i<txtall.length;i++)
               {
                    if(i==0)
                        temp = txtall[i].value;
                    else 
                        temp += ";"+txtall[i].value;
               }
               txtShow.value =temp;
           }
           else
           {
                txtShow.value = txtall.value;
           } 
        }
    <div>
               <input id="Button2" type="button" value="发送" onclick="getValue();" />
               <input type="text" id="txtAddress" style="width:500px;"/>
           </div> 
    获取值