高手帮忙，要在页面中增加一个按钮，按后把如贴中的表单复制一遍并显示在当前页面。

就好像现在页面中有一个SELECT和TEXT 按一下按钮后，复制该SELECT和TEXT一遍，按两下，复制该SELECT和TEXT两遍。<%@ page contentType="text/html;charset=gb2312"%> 
<%@ page import="java.util.*"%> 
<%@ page import="tdph.vo.Gzxz" %> <html> 
<head> 
<title>现场安全监督表 </title> 
<link href="css/main.css" rel="stylesheet" type="text/css"> 
<style type="text/css"> 
<!-- 
body { 
BACKGROUND: #EEEEFF; 
} 
--> 
</style> 
<SCRIPT type="text/javascript" src="js/JSCalendar.js"> </SCRIPT> 
      <SCRIPT> 
    //获取年月日 
      function inputDate2(n){    
    var date = new Date(); 
    JSCalendar(n,date.getFullYear(),date.getMonth(),date.getDate()); 
    
    var objworktimesure=document.getElementById("worktimesure"); 
  if(objworktimesure.checked){ 
  document.getElementById("add").ts.value=""; 
  }else{ 
  document.getElementById("add").ts.value=""; 
  }//自己添加的 
    } 
      </SCRIPT> 
</head> 
<body> 
<center> 
  <% 
List gzxz = null; 
        gzxz = (List) request.getAttribute("gzxz"); %> 
<form name="myForm" action="plan.do" method="POST"> 
      <table border="1"> 
      <tr> 
      <td width="119">数据来源 </td> 
      <td width="250"> <select name="sjly" size="1"  onchange="setSection(this.selectedIndex)"> 
                </select> </td> 
    <td width="118"> 查询时间： </td> 
    <td width="250"> <input type="text" id="kssj" name="kssj1" size="20" onClick="javascript:inputDate2(this);"> </td> 
      <td width="118"> 至： </td> 
<td width="250"> <input type="text" id="kssj" name="kssj2" size="20" onClick="javascript:inputDate2(this);"> </td>   <td width="118"> 工作性质： </td> 
  <td width="250"> <select name="gzxz" size="1" title="工作性质"> 
  <% 
              Iterator iter = gzxz.iterator(); 
while (iter.hasNext()) { 
Gzxz gz = (Gzxz) iter.next(); // 进行循环打印，打印出所有的内容，以表格形式 
// 从数据库中取出内容 
String gzxzname =  gz.getGzxz(); 
                    %> 
                <option value= <%=gzxzname%>> <%=gzxzname%> </option> 
                <% 
                } 
                %> 
                </select> </td> 
      <td width="119">数据状态 </td> 
      <td width="250"> <select name="sjzt" size="1"> 
      </select> </td> 
  </tr> 
<tr> 
    <td  >电压等级 </td> 
    <td > 
    <input type="checkbox" id="dydj" name="dydj" value="10000" checked>&nbsp;10kV 
    <input type="checkbox" id="dydj" name="dydj" value="20000" checked>&nbsp;20kV 
    <input type="checkbox" id="dydj" name="dydj" value="35000" checked>&nbsp;35kV 
    <input type="checkbox" id="dydj" name="dydj" value="110000" checked>110kV 
    <input type="checkbox" id="dydj" name="dydj" value="220000" checked>220kV 
    <input type="checkbox" id="dydj" name="dydj" value="500000" checked>500kV 
    <input type="checkbox" id="dydj" name="dydj" value="-1" checked>非一次设备 
    </td> 
    </tr> 
</table> 
<input type="hidden" name="status" value="queryone"> 
<input type="submit" value="查询"> 
</form> 
</center> 
<script language="javascript" type="text/javascript">         var section1=new Array() ; 
    section1[0]=["未批准","未批准"] 
    section1[1]=["已批准","已批准"] 
    
    var section2=new Array() ; 
    section2[0]=["未报送","未报送"] 
    section2[1]=["已报送","已报送"] 
    
    var chapterArr=new Array() ; 
    
    chapterArr[0]=["挂牌","1",section2] 
    chapterArr[1]=["年度计划","2",section2] 
    chapterArr[2]=["季度计划","3",section2] 
    chapterArr[3]=["主设备停电计划","4",section2] 
    chapterArr[4]=["月度和日计划","5",section1] 
    
    function setSection(chapter) 
    { 
      //清除第二个下拉列表框 
      for(var i=document.myForm.sjzt.length-1;i>-1;i--) 
      { 
          document.myForm.sjzt.remove(i); 
      } 
      //调用数组 
      var arr=chapterArr[chapter][2]; 
      //通过循环添加选项 
      for(var i=0;i <arr.length;i++) 
      { 
          document.myForm.sjzt.options[i]=new Option(arr[i][0],arr[i][1]); 
      } 
    } 
        //初始化第一个下拉列表框 
        for(var i=0;i <chapterArr.length;i++) 
        { 
              document.myForm.sjly.options[i]=new Option(chapterArr[i][0],chapterArr[i][1]) ; 
        }    
        setSection(0);    </script> 
</body> 
</html>

解决方案 »

  1.   

    function createDiv(){
            var chile = document.createElement("div");
            
            var txtNode =  document.createTextNode("winson");
            chile.appendChild(txtNode);
            //注意之里是document.body
            document.body.appendChild(chile);
            
        }
    给你一个例子~！
      

  2.   

    <%@ page contentType="text/html;charset=gb2312"%> 
    <%@ page import="java.util.*"%> 
    <%@ page import="tdph.vo.Gzxz" %> <html> 
    <head> 
    <title>现场安全监督表 </title> 
    <link href="css/main.css" rel="stylesheet" type="text/css"> 
    <style type="text/css"> 
    <!-- 
    body { 
    BACKGROUND: #EEEEFF; 
    } 
    --> 
    </style> 
    <SCRIPT type="text/javascript" src="js/JSCalendar.js"> </SCRIPT> 
          <SCRIPT> 
        //获取年月日 
          function inputDate2(n){    
        var date = new Date(); 
        JSCalendar(n,date.getFullYear(),date.getMonth(),date.getDate()); 
        
        var objworktimesure=document.getElementById("worktimesure"); 
      if(objworktimesure.checked){ 
      document.getElementById("add").ts.value=""; 
      }else{ 
      document.getElementById("add").ts.value=""; 
      }//自己添加的 
        }       </SCRIPT> 
    </head> 
    <body> 
    <center> 
      <% 
    List gzxz = null; 
            gzxz = (List) request.getAttribute("gzxz"); %> 
    <form name="myForm" action="plan.do" method="POST"> 
          <table border="1" id='nodeInfo'> 
          <tr> 
          <td width="119">数据来源 </td> 
          <td width="250"> <select name="sjly" size="1"  onchange="setSection(this.selectedIndex)"> 
                    </select> </td> 
        <td width="118"> 查询时间： </td> 
        <td width="250"> <input type="text" id="kssj" name="kssj1" size="20" onClick="javascript:inputDate2(this);"> </td> 
          <td width="118"> 至： </td> 
    <td width="250"> <input type="text" id="kssj" name="kssj2" size="20" onClick="javascript:inputDate2(this);"> </td>   <td width="118"> 工作性质： </td> 
      <td width="250"> <select name="gzxz" size="1" title="工作性质"> 
      <% 
                  Iterator iter = gzxz.iterator(); 
    while (iter.hasNext()) { 
    Gzxz gz = (Gzxz) iter.next(); // 进行循环打印，打印出所有的内容，以表格形式 
    // 从数据库中取出内容 
    String gzxzname =  gz.getGzxz(); 
                        %> 
                    <option value= <%=gzxzname%>> <%=gzxzname%> </option> 
                    <% 
                    } 
                    %> 
                    </select> </td> 
          <td width="119">数据状态 </td> 
          <td width="250"> <select name="sjzt" size="1"> 
          </select> </td> 
      </tr> 
    </table> 
    <input type="hidden" name="status" value="queryone"> 
    <input type="button" value="增加一行" onclick='addRow()'> 
    </form> 
    </center> 
    <script language="javascript" type="text/javascript"> 
    function addRow(){
    var index=event.srcElement.parentElement.parentElement.rowIndex;
    var table=document.getElementById("nodeInfo");
    var tr=table.insertRow(index);
    //数据来源名称
    td=tr.insertCell();
    td.className="input";
    var swfPathStartNodeNameEl=document.createElement("input");
    swfPathStartNodeNameEl.setAttribute("type","text");
    swfPathStartNodeNameEl.setAttribute("name","swfPathStartNodeName");
    swfPathStartNodeNameEl.setAttribute("readOnly","readOnly");
    swfPathStartNodeNameEl.setAttribute("value","数据来源");
    swfPathStartNodeNameEl.className="readonly";
    td.appendChild(swfPathStartNodeNameEl);
    //数据来源
    td=tr.insertCell();
    td.className="input";
    var swfNodeNodeTypesEl=document.createElement("select");
    swfNodeNodeTypesEl.cssText="width:90%";
    swfNodeNodeTypesEl.setAttribute("name","sjly");
    td.appendChild(swfNodeNodeTypesEl); //起始节点名称
    td=tr.insertCell();
    td.className="input";
    var swfPathStartNodeNameEl1=document.createElement("input");
    swfPathStartNodeNameEl1.setAttribute("type","text");
    swfPathStartNodeNameEl1.setAttribute("name","swfPathStartNodeName");
    swfPathStartNodeNameEl1.setAttribute("readOnly","readOnly");
    swfPathStartNodeNameEl1.setAttribute("value","查询时间");
    swfPathStartNodeNameEl1.className="readonly";
    td.appendChild(swfPathStartNodeNameEl1);
    //数据来源
    td=tr.insertCell();
    td.className="input";
    var swfNodeNodeTypesEl1=document.createElement("select");
    swfNodeNodeTypesEl1.cssText="width:90%";
    swfNodeNodeTypesEl1.setAttribute("name","sjly");
    td.appendChild(swfNodeNodeTypesEl1); //起始节点名称
    td=tr.insertCell();
    td.className="input";
    var swfPathStartNodeNameEl2=document.createElement("input");
    swfPathStartNodeNameEl2.setAttribute("type","text");
    swfPathStartNodeNameEl2.setAttribute("name","swfPathStartNodeName");
    swfPathStartNodeNameEl2.setAttribute("readOnly","readOnly");
    swfPathStartNodeNameEl2.setAttribute("value","至");
    swfPathStartNodeNameEl2.className="readonly";
    td.appendChild(swfPathStartNodeNameEl2);
    //数据来源
    td=tr.insertCell();
    td.className="input";
    var swfNodeNodeTypesEl2=document.createElement("select");
    swfNodeNodeTypesEl2.cssText="width:90%";
    swfNodeNodeTypesEl2.setAttribute("name","sjly");
    td.appendChild(swfNodeNodeTypesEl2);
    //起始节点名称
    td=tr.insertCell();
    td.className="input";
    var swfPathStartNodeNameEl3=document.createElement("input");
    swfPathStartNodeNameEl3.setAttribute("type","text");
    swfPathStartNodeNameEl3.setAttribute("name","swfPathStartNodeName");
    swfPathStartNodeNameEl3.setAttribute("readOnly","readOnly");
    swfPathStartNodeNameEl3.setAttribute("value","工作性质");
    swfPathStartNodeNameEl3.className="readonly";
    td.appendChild(swfPathStartNodeNameEl3);
    //数据来源
    td=tr.insertCell();
    td.className="input";
    var swfNodeNodeTypesEl3=document.createElement("select");
    swfNodeNodeTypesEl3.cssText="width:90%";
    swfNodeNodeTypesEl3.setAttribute("name","sjly");
    td.appendChild(swfNodeNodeTypesEl3);
    //起始节点名称
    td=tr.insertCell();
    td.className="input";
    var swfPathStartNodeNameEl4=document.createElement("input");
    swfPathStartNodeNameEl4.setAttribute("type","text");
    swfPathStartNodeNameEl4.setAttribute("name","swfPathStartNodeName");
    swfPathStartNodeNameEl4.setAttribute("readOnly","readOnly");
    swfPathStartNodeNameEl4.setAttribute("value","数据状态");
    swfPathStartNodeNameEl4.className="readonly";
    td.appendChild(swfPathStartNodeNameEl4);
    //数据来源
    td=tr.insertCell();
    td.className="input";
    var swfNodeNodeTypesEl4=document.createElement("select");
    swfNodeNodeTypesEl4.cssText="width:90%";
    swfNodeNodeTypesEl4.setAttribute("name","sjly");
    td.appendChild(swfNodeNodeTypesEl4);
    }        var section1=new Array() ; 
        section1[0]=["未批准","未批准"] 
        section1[1]=["已批准","已批准"] 
        
        var section2=new Array() ; 
        section2[0]=["未报送","未报送"] 
        section2[1]=["已报送","已报送"] 
        
        var chapterArr=new Array() ; 
        
        chapterArr[0]=["挂牌","1",section2] 
        chapterArr[1]=["年度计划","2",section2] 
        chapterArr[2]=["季度计划","3",section2] 
        chapterArr[3]=["主设备停电计划","4",section2] 
        chapterArr[4]=["月度和日计划","5",section1] 
        
        function setSection(chapter) 
        { 
          //清除第二个下拉列表框 
          for(var i=document.myForm.sjzt.length-1;i>-1;i--) 
          { 
              document.myForm.sjzt.remove(i); 
          } 
          //调用数组 
          var arr=chapterArr[chapter][2]; 
          //通过循环添加选项 
          for(var i=0;i <arr.length;i++) 
          { 
              document.myForm.sjzt.options[i]=new Option(arr[i][0],arr[i][1]); 
          } 
        } 
            //初始化第一个下拉列表框 
            for(var i=0;i <chapterArr.length;i++) 
            { 
                  document.myForm.sjly.options[i]=new Option(chapterArr[i][0],chapterArr[i][1]) ; 
            }    
            setSection(0);    </script> 
    </body> 
    </html>select里面的数据你自己改改，加入就好了。
      

  3.   

    function createDiv(){
      var div = document.createElement("<div>");
      div.id = "div-id";
      div.name = div.id;
      div.style.width = 150;
      div.style.height = 150;
      div.style.position = "absolute";
      div.style.top = 50;
      div.style.left = 50;
      div.style.zIndex = 1000;
      div.style.display = "";
      div.innerHTML = "XXXXX";
      div.onclick = function(){callBackFunc("value1","value2");
      document.body.appendChild(div);
      return div;
    }给你一个参考吧，
      

  4.   

      你可以把要复制的内容放到一个div里面 给div一个id
       点击按钮的时候根据div的id拿到你要复制的内容
        再把内容保存到一个变量里
        然后document.getElementById("你想放的位置对应id").innerHTML=变量;