页面中table原有的内容,第一行生成的控件name为a1,a2
第二行为b1,b2,b3通过使用函数addrow,新生成的每一行中,控件的name如何定义??????新生成每一行name最好不一样,因为下面要执行@$_GET,还有在MySQL命令,能使循环方便些。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>database</title><style>a{TEXT-DECORATION:none}</style>
<style type="text/css">
<!--
body {
background-color: #ddded6;
margin-top: 0px;
margin-bottom: 0px;
}
body,td,th {
font-size: medium;
}
-->
</style>
</head>
<SCRIPT>   
  function   addRow(){   
  var   row   =   document.getElementById("ModelRow"); 
  var   ib    =   document.getElementById("insertBefore");     
  var   n     =   row.cloneNode(true);
  n.setAttribute("id",null);  
  row.parentNode.insertBefore(n,ib);
  }
  function   deleteRow(){   
  var   ib     =   document.getElementById("InsertBefore");   
  var   row    =   ib.previousSibling;   
  if(   row.id   ==   "ModelRow"   )   
  {   
  alert('can not do');   
  return;   
  }  
  ib.parentNode.removeChild(row);   
  }
</SCRIPT> <body text="#000000" link="#0000ff" vlink="#000080" alink="#FF0000">
<table width="1008" border="0" align="center" cellspacing="0" bgcolor="#99FF00">
  <tr><td>
<table width="1000" height="600" border="0" align="center" cellspacing="0" bgcolor="#ffffff" id="3">
  <tr>
    <td>
 
     <?php
          $idsearch = @$_GET['a1']; $idstring = trim(@$_GET['a2']);
          $seqsearch = @$_GET['b1']; $seqstring = trim(@$_GET['b2']);$seqao = @$_GET['b3'];
  
  if ( $idstring != "" or $seqstring !="")
  { 
               $conn =mysql_connect('localhost','root','') or die("connect err:".mysql_error());
           mysql_query("use yuangong");
      if ($idsearch =='all' or $seqsearch == 'all'){
                        if ($idsearch =='all'){$allfields1 = "(id like \"%$idstring%\" or name like \"%$idstring%\" or address like \"%$idstring%\")";} 
                    else{$allfields1 = "$idsearch like \"%$idstring%\"";}                     if ($seqsearch =='all'){$allfields2 = "(id like \"%$seqstring%\" or name like \"%$seqstring%\" or address like \"%$seqstring%\")";} 
                    else{$allfields2 = "$seqsearch like \"%$seqstring%\"";}


   // Build SQL Query when at least one all exists
                   $usql = "select worker where $allfields1 $seqao $allfields2"; }

                   // Build SQL Query when no "all" exists
                 else{ $usql = "select worker where $idsearch like \"%$idstring%\" $seqao $seqsearch like \"%$seqstring%\"";}
 $results = mysql_query("$usql");
 $numrows = mysql_num_rows($results);
 $sql_limit = (isset($_GET['limit'])) ? $_GET['limit'] : 0; //get the initial or previous record number
             $limit_val = 10;  // number of records per page
             $pagedsql="$usql order by id limit $sql_limit,$limit_val";
             $pagedresult = mysql_query($pagedsql);?>
<?php } else{?>
      <div   align="center">                                   
      <input   type="button"   name="Submit"   value=" + "   onclick="addRow()">   
      <input   type="button"   name="Submit3"   value=" - "   onclick="deleteRow()">   
      <br>   
      </div>
      <form action="test.php" target="_blank" method="get">                                            
        <table width="958">                                                                                 
          <tr> <th width="25%">Select search field </th> 
                 <th width="55%">Input your string for searching</th> 
                <th width="20%">Options</th>
            </tr>
          
          <tr><td align = "center"width="25%"><select name="a1" style="width: 100%">
                                                      <option value = "all">All</option>
                                                  <option value = "id">ID</option>
                                                  <option value = "name">name</option>
                                                      <option value = "address">address</option></select></td>              
               <td align = "center" width="55%"><input type="text" size="70%"  name="a2" /> </td>                             </tr>
          
          <tr id="ModelRow"><td align = "center"width="25%"><select name="b1" style="width: 100%">
                                                      <option value = "all">All</option>
                                                  <option value = "id">ID</option>
                                                  <option value = "name">name</option>
                                                      <option value = "address">address</option></select></td> 
                <td align = "center" width="55%"><input type="text" size="70%"  name="b2" /> </td>                 
                <td align = "center" width="20%">                                                                   
                  <input type="radio" name="b3" value ="and" checked />and &nbsp &nbsp                           
                  <input type="radio" name="b3" value ="or" />or <br><br><br><br></td>
            </tr>
          
          <tr id="InsertBefore"><td align = "center"width="25%">
                  <input type="reset" name="reset" value ="Reset" />&nbsp&nbsp
                  <input type="submit" name="submit" value ="Search" /></td>
            </tr>                                   
          </table>                                                                                            
          </form> 
          <?php } ?>      </td>
    </tr>
</table>
</td></tr></table>
</body>
</html>

解决方案 »

  1.   

    用个数组存名字function   addRow(){   
      var   row   =   document.getElementById("ModelRow"); 
      var   ib    =   document.getElementById("insertBefore");     
      var   n     =   row.cloneNode(true);
    //加入n.name=array[n];
      n.setAttribute("id",null);  
      row.parentNode.insertBefore(n,ib);
      }
      

  2.   

    HTML改动:
    调整控件的名字 a2,b2,c2
    给table 一个id="tb"
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>database</title><style>a{TEXT-DECORATION:none}</style>
    <style type="text/css">
    <!--
    body {
        background-color: #ddded6;
        margin-top: 0px;
        margin-bottom: 0px;
    }
    body,td,th {
        font-size: medium;
    }
    -->
    </style>
    </head>
    <SCRIPT>
    var sm = 2;
    function   addRow(){   
      var   row   =   document.getElementById("ModelRow"); 
      var   ib    =   document.getElementById("insertBefore");     
      sm++;
      var   tr    =   document.createElement("tr");
      var   td    =   document.createElement("td");
      td.align="center"
      td.width="25%"
      var   sel   =   document.createElement("<select name='a" + sm+ "' style='width: 100%'>");
      sel.options.add(new Option("All","all"));
      sel.options.add(new Option("ID","id"));
      sel.options.add(new Option("name","name"));
      sel.options.add(new Option("address","address"));
      td.appendChild(sel);
      tr.appendChild(td);
      td    =   document.createElement("td");
      td.align = "center"
      td.width = "55%"
      var input1 = document.createElement("<input type='text' size='70%' name='b" + sm + "' />");
      td.appendChild(input1);
      tr.appendChild(td);
      td    =   document.createElement("td");
      td.align = "center"
      td.width = "20%"
      var input2 = document.createElement("<input type='radio' value='and' checked name='c" + sm + "' />");
      td.appendChild(input2);
      var t1 = document.createTextNode("and   ");
      td.appendChild(t1);
      var input3 = document.createElement("<input type='radio' value='or' name='c" + sm + "' />");
      td.appendChild(input3);
      var t2 = document.createTextNode("or");
      td.appendChild(t2);
      var br1 = document.createElement("br");
      td.appendChild(br1);
      var br2 = document.createElement("br");
      td.appendChild(br2);
      var br3 = document.createElement("br");
      td.appendChild(br3);
      var br4 = document.createElement("br");
      td.appendChild(br4);
      tr.appendChild(td);
      row.parentNode.insertBefore(tr,ib);
      var tbl = document.getElementById("tb");
      if(document.all) tbl.outerHTML = tbl.outerHTML;
    }
    function   deleteRow(){   
      var   ib     =   document.getElementById("InsertBefore");   
      var   row    =   ib.previousSibling;   
      if(   row.id   ==   "ModelRow"   )   
      {   
      alert('can not do');   
      return;
      }  
      ib.parentNode.removeChild(row);   
    }
    </SCRIPT> <body text="#000000" link="#0000ff" vlink="#000080" alink="#FF0000">
    <table width="1008" border="0" align="center" cellspacing="0" bgcolor="#99FF00">
      <tr><td>
    <table width="1000" height="600" border="0" align="center" cellspacing="0" bgcolor="#ffffff" id="3">
      <tr>
        <td>
          <div   align="center">                                   
          <input   type="button"   name="Submit"   value=" + "   onclick="addRow()">   
          <input   type="button"   name="Submit3"   value=" - "   onclick="deleteRow()">   
          <br>   
          </div>
          <form action="test.php" target="_blank" method="get">                                            
            <table width="958" id="tb">                                                                                 
              <tr> <th width="25%">Select search field </th> 
                     <th width="55%">Input your string for searching</th> 
                       <th width="20%">Options</th>
                </tr>
              
              <tr><td align = "center"width="25%"><select name="a1" style="width: 100%">
                                                          <option value = "all">All</option>
                                                          <option value = "id">ID</option>
                                                          <option value = "name">name</option>
                                                          <option value = "address">address</option></select></td>              
                   <td align = "center" width="55%"><input type="text" size="70%"  name="b1" /> </td>                             </tr>
              
              <tr id="ModelRow"><td align="center" width="25%"><select name="a2" style="width: 100%">
                                                          <option value = "all">All</option>
                                                          <option value = "id">ID</option>
                                                          <option value = "name">name</option>
                                                          <option value = "address">address</option></select></td> 
                    <td align = "center" width="55%"><input type="text" size="70%"  name="b2" /> </td>                 
                    <td align = "center" width="20%">                                                                   
                      <input type="radio" name="c2" value ="and" checked />and &nbsp; &nbsp;                           
                      <input type="radio" name="c2" value ="or" />or <br><br><br><br></td>
                </tr>
              
              <tr id="InsertBefore"><td align = "center"width="25%">
                      <input type="reset" name="reset" value ="Reset" />&nbsp;&nbsp;
                      <input type="submit" name="submit" value ="Search" /></td>
                </tr>                                   
              </table>                                                                                            
              </form> 
              </td>
        </tr>
    </table>
    </td></tr></table>
    </body>
    </html>
      

  3.   

    楼上的高手再看看,就是默认的是两组数据,点“+”可能增加若干组,然后那段php代码可能要用循环。<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>database</title><style>a{TEXT-DECORATION:none}</style>
    <style type="text/css">
    <!--
    body {
        background-color: #ddded6;
        margin-top: 0px;
        margin-bottom: 0px;
    }
    body,td,th {
        font-size: medium;
    }
    -->
    </style>
    </head>
    <SCRIPT>
    var sm = 2;
    function   addRow(){   
      var   row   =   document.getElementById("ModelRow"); 
      var   ib    =   document.getElementById("insertBefore");     
      sm++;
      var   tr    =   document.createElement("tr");
      var   td    =   document.createElement("td");
      td.align="center"
      td.width="25%"
      var   sel   =   document.createElement("<select name='a" + sm+ "' style='width: 100%'>");
      sel.options.add(new Option("All","all"));
      sel.options.add(new Option("ID","id"));
      sel.options.add(new Option("name","name"));
      sel.options.add(new Option("address","address"));
      td.appendChild(sel);
      tr.appendChild(td);
      td    =   document.createElement("td");
      td.align = "center"
      td.width = "55%"
      var input1 = document.createElement("<input type='text' size='70%' name='b" + sm + "' />");
      td.appendChild(input1);
      tr.appendChild(td);
      td    =   document.createElement("td");
      td.align = "center"
      td.width = "20%"
      var input2 = document.createElement("<input type='radio' value='and' checked name='c" + sm + "' />");
      td.appendChild(input2);
      var t1 = document.createTextNode("and   ");
      td.appendChild(t1);
      var input3 = document.createElement("<input type='radio' value='or' name='c" + sm + "' />");
      td.appendChild(input3);
      var t2 = document.createTextNode("or");
      td.appendChild(t2);
      var br1 = document.createElement("br");
      td.appendChild(br1);
      var br2 = document.createElement("br");
      td.appendChild(br2);
      var br3 = document.createElement("br");
      td.appendChild(br3);
      var br4 = document.createElement("br");
      td.appendChild(br4);
      tr.appendChild(td);
      row.parentNode.insertBefore(tr,ib);
      var tbl = document.getElementById("tb");
      if(document.all) tbl.outerHTML = tbl.outerHTML;
    }
    function   deleteRow(){   
      var   ib     =   document.getElementById("InsertBefore");   
      var   row    =   ib.previousSibling;   
      if(   row.id   ==   "ModelRow"   )   
      {   
      alert('can not do');   
      return;
      }  
      ib.parentNode.removeChild(row);   
    }
    </SCRIPT> <body text="#000000" link="#0000ff" vlink="#000080" alink="#FF0000">
    <table width="1008" border="0" align="center" cellspacing="0" bgcolor="#99FF00">
      <tr><td>
    <table width="1000" height="600" border="0" align="center" cellspacing="0" bgcolor="#ffffff" id="3">
      <tr>
        <td>
        
          <?php
              $idsearch = @$_GET['a1']; $idstring = trim(@$_GET['a2']);
              $seqsearch = @$_GET['b1']; $seqstring = trim(@$_GET['b2']);$seqao = @$_GET['b3'];
              
              if ( $idstring != "" or $seqstring !="")
              { 
                   $conn =mysql_connect('localhost','root','') or die("connect err:".mysql_error());
                   mysql_query("use yuangong");
                      if ($idsearch =='all' or $seqsearch == 'all'){
                            if ($idsearch =='all'){$allfields1 = "(id like \"%$idstring%\" or name like \"%$idstring%\" or address like \"%$idstring%\")";} 
                            else{$allfields1 = "$idsearch like \"%$idstring%\"";}                        if ($seqsearch =='all'){$allfields2 = "(id like \"%$seqstring%\" or name like \"%$seqstring%\" or address like \"%$seqstring%\")";} 
                            else{$allfields2 = "$seqsearch like \"%$seqstring%\"";}
                            
            
                           // Build SQL Query when at least one all exists
                           $usql = "select worker where $allfields1 $seqao $allfields2"; }
        
                           // Build SQL Query when no "all" exists
                     else{ $usql = "select worker where $idsearch like \"%$idstring%\" $seqao $seqsearch like \"%$seqstring%\"";}
                     $results = mysql_query("$usql");
                     $numrows = mysql_num_rows($results);
                     $sql_limit = (isset($_GET['limit'])) ? $_GET['limit'] : 0; //get the initial or previous record number
                     $limit_val = 10;  // number of records per page
                     $pagedsql="$usql order by id limit $sql_limit,$limit_val";
                     $pagedresult = mysql_query($pagedsql);?>
        <?php } else{?>      <div   align="center">                                   
          <input   type="button"   name="Submit"   value=" + "   onclick="addRow()">   
          <input   type="button"   name="Submit3"   value=" - "   onclick="deleteRow()">   
          <br>   
          </div>
          <form action="test.php" target="_blank" method="get">                                            
            <table width="958" id="tb">                                                                                 
              <tr> <th width="25%">Select search field </th> 
                     <th width="55%">Input your string for searching</th> 
                       <th width="20%">Options</th>
                </tr>
              
              <tr><td align = "center"width="25%"><select name="a1" style="width: 100%">
                                                          <option value = "all">All</option>
                                                          <option value = "id">ID</option>
                                                          <option value = "name">name</option>
                                                          <option value = "address">address</option></select></td>              
                   <td align = "center" width="55%"><input type="text" size="70%"  name="b1" /> </td>                             </tr>
              
              <tr id="ModelRow"><td align="center" width="25%"><select name="a2" style="width: 100%">
                                                          <option value = "all">All</option>
                                                          <option value = "id">ID</option>
                                                          <option value = "name">name</option>
                                                          <option value = "address">address</option></select></td> 
                    <td align = "center" width="55%"><input type="text" size="70%"  name="b2" /> </td>                 
                    <td align = "center" width="20%">                                                                   
                      <input type="radio" name="c2" value ="and" checked />and &nbsp; &nbsp;                           
                      <input type="radio" name="c2" value ="or" />or <br><br><br><br></td>
                </tr>
              
              <tr id="InsertBefore"><td align = "center"width="25%">
                      <input type="reset" name="reset" value ="Reset" />&nbsp;&nbsp;
                      <input type="submit" name="submit" value ="Search" /></td>
                </tr>                                   
              </table>                                                                                            
              </form> 
              <?php } ?> </td>
        </tr>
    </table>
    </td></tr></table>
    </body>
    </html>