<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="zourinet">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT=""></HEAD><BODY>
<form name="form1" method="post" action="">
    <table cellpadding="0" cellspacing="0" border="1" width="100%" id="DetailTable">
        <tr>
            <td>a</td>
            <td>b</td>
            <td>e</td>
            <td>f</td>        </tr>
        <tr>
            <td>
                <select name="b" onchange="addRow()">
                    <option value="-1">请选择</option>
                    <option value="1">test1</option>
                    <option value="2">test2</option>
                    <option value="3">test3</option>
                    <option value="4">test4</option>
            </td>
            <td>d</td>
            <td>g</td>
            <td>h</td>
        </tr>
    </table>
    <script type="text/javascript">
        function addRow()
        {            tb = document.all.DetailTable;
            var row = tb.insertRow();
            var cell1 = row.insertCell();
            var cell2 = row.insertCell();
            var cell3 = row.insertCell();
            var cell4 = row.insertCell();
            if (document.form1.b.value == 1)
            {
                cell1.innerHTML = "存栏量";
                cell2.innerHTML = "<input   type=\"text\"   name=\"cunll\"   maxlength=\"50\">";
                cell3.innerHTML = "出栏量";
                cell4.innerHTML = "<input   type=\"text\"   name=\"chull\"   maxlength=\"50\">";
            }
            else if (document.form1.b.value == 2)
            {
                cell1.innerHTML = "品种";
                cell2.innerHTML = "<input   type=\"text\"   name=\"cunll\"   maxlength=\"50\">";
                cell3.innerHTML = "数量";
                cell4.innerHTML = "<select name=\"lb\">\n" +
                                  "            <option value=\"1\">猪</option>\n" +
                                  "            <option value=\"2\">牛</option>\n" +
                                  "            <option value=\"2\">羊</option>\n" +
                                  "        </select>";
            }
            else if (document.form1.b.value == 3)
            {
                略
              }
            else if (document.form1.b.value == 3)
            {
                略
             }        }
    </script>
</form>
</BODY>
</HTML>
那段addRow方法是用select   标签onchange方法调用的 
每次调用这个方法的时候都是继续增加行和列 
但我的本意是为每个select选项单独增加几行或者几列 
请问各位大大怎么解决噢吖~

解决方案 »

  1.   

    lz
    --------------------------------
    但我的本意是为每个select选项单独增加几行或者几列   
    这句什么意思?
      

  2.   

    就以上面的例子来说
    当b=1的时候,我加了一行两列,如存栏量和出栏量
    当b=2的时候,上面增加的那行我不想要,只想增加另外一行或者多行,而不是在增加的基础上继续增加噢~
    用delete方法或者写多个页面都好麻烦的,请问有什么办法解决啊?
      

  3.   

    lz
    ----------------------------------------------------
     不麻烦<!DOCTYPE   HTML   PUBLIC   "-//W3C//DTD   HTML   4.0   Transitional//EN">
    <HTML>
    <HEAD>
            <TITLE>   New   Document   </TITLE>
            <META   NAME="Generator"   CONTENT="EditPlus">
            <META   NAME="Author"   CONTENT="zourinet">
            <META   NAME="Keywords"   CONTENT="">
            <META   NAME="Description"   CONTENT=""></HEAD><BODY>
    <form   name="form1"   method="post"   action="">
            <table   cellpadding="0"   cellspacing="0"   border="1"   width="100%"   id="DetailTable">
                    <tr>
                            <td> a </td>
                            <td> b </td>
                            <td> e </td>
                            <td> f </td>                </tr>
                    <tr>
                            <td>
                                    <select   name="b"   onchange="addRow()">
                                            <option   value="-1"> 请选择 </option>
                                            <option   value="1"> test1 </option>
                                            <option   value="2"> test2 </option>
                                            <option   value="3"> test3 </option>
                                            <option   value="4"> test4 </option>
                            </td>
                            <td> d </td>
                            <td> g </td>
                            <td> h </td>
                    </tr>
            </table>
            <script   type="text/javascript">
    isExist = false;
                    function   addRow()
                    {

                            tb   =   document.all.DetailTable;
    if(isExist)
    {
    tb.deleteRow();
    }
                            var   row   =   tb.insertRow();
                            var   cell1   =   row.insertCell();
                            var   cell2   =   row.insertCell();
                            var   cell3   =   row.insertCell();
                            var   cell4   =   row.insertCell();
                            if   (document.form1.b.value   ==   1)
                            {
                                    cell1.innerHTML   =   "存栏量";
                                    cell2.innerHTML   =   " <input       type=\"text\"       name=\"cunll\"       maxlength=\"50\"> ";
                                    cell3.innerHTML   =   "出栏量";
                                    cell4.innerHTML   =   " <input       type=\"text\"       name=\"chull\"       maxlength=\"50\"> ";
                            }
                            else   if   (document.form1.b.value   ==   2)
                            {
                                    cell1.innerHTML   =   "品种";
                                    cell2.innerHTML   =   " <input       type=\"text\"       name=\"cunll\"       maxlength=\"50\"> ";
                                    cell3.innerHTML   =   "数量";
                                    cell4.innerHTML   =   " <select   name=\"lb\"> \n"   +
                                                                        "                         <option   value=\"1\"> 猪 </option> \n"   +
                                                                        "                         <option   value=\"2\"> 牛 </option> \n"   +
                                                                        "                         <option   value=\"2\"> 羊 </option> \n"   +
                                                                        "                 </select> ";
                            }
                            else   if   (document.form1.b.value   ==   3)
                            {
                                    略
                                }
                            else   if   (document.form1.b.value   ==   3)
                            {
                                    略
                              }
    isExist=true;                }
            </script>
    </form>
    </BODY>
    </HTML> 
      

  4.   

    如果只是确定的增加一行可以行得通,但如何某个条件增加若干行呢?
    example:
    <!DOCTYPE   HTML   PUBLIC   "-//W3C//DTD   HTML   4.0   Transitional//EN">
    <HTML>
    <HEAD>
        <TITLE> New Document </TITLE>
        <META NAME="Generator" CONTENT="EditPlus">
        <META NAME="Author" CONTENT="zourinet">
        <META NAME="Keywords" CONTENT="">
        <META NAME="Description" CONTENT=""></HEAD><BODY>
    <form name="form1" method="post" action="">
    <table cellpadding="0" cellspacing="0" border="1" width="100%" id="DetailTable">
        <tr>
            <td> a </td>
            <td> b </td>
            <td> e </td>
            <td> f </td>    </tr>
        <tr>
            <td>
                <select name="b" onchange="addRow()">
                    <option value="-1"> 请选择 </option>
                    <option value="1"> test1 </option>
                    <option value="2"> test2 </option>
                    <option value="3"> test3 </option>
                    <option value="4"> test4 </option>
            </td>
            <td> d </td>
            <td> g </td>
            <td> h </td>
        </tr>
    </table>
    <script type="text/javascript">
        isExist = false;
        function addRow()
        {        tb = document.all.DetailTable;
            if (isExist)
            {
                tb.deleteRow();
            }
                        var row1 = tb.insertRow();
                row1.bgColor = "#E7EDF1";
                var cell1 = row1.insertCell();
                var cell2 = row1.insertCell();
                cell2.bgColor = "#FFFFFF";
                var cell3 = row1.insertCell();
                var cell4 = row1.insertCell();
                cell4.bgColor = "#FFFFFF";
                            var row2 = tb.insertRow();
                row2.bgColor = "#E7EDF1";
                var cell5 = row2.insertCell();
                var cell6 = row2.insertCell();
                cell6.bgColor = "#FFFFFF";
                var cell7 = row2.insertCell();
                var cell8 = row2.insertCell();
                cell8.bgColor = "#FFFFFF";
            if (form1.b.value == "1")
            {
                cell1.innerHTML = "畜别:";
                cell2.innerHTML = "<select name=\"xb\" onchange=\"setPZ()\">\n" +
                                  "            <option value=\"\">请选择</option>\n" +
                                  "            #foreach($xbobj in $xb)\n" +
                                  "            <option value=\"$xbobj.id\">$!xbobj.name</option>\n" +
                                  "            #end\n" +
                                  "        </select>";
                cell3.innerHTML = "品种:";
                cell4.innerHTML = "<select name=\"pz\">\n" +
                                  "            <option value=\"\">请选择</option>\n" +
                                  "        </select>";            cell5.innerHTML = "存栏量:";
                cell6.innerHTML = "<input type=\"text\" name=\"cunll\" maxlength=\"50\">";
                cell7.innerHTML = "出栏量:";
                cell8.innerHTML = "<input type=\"text\" name=\"chull\" maxlength=\"50\">";
            }
            else if (form1.b.value == "2")
            {
                var row1 = tb.insertRow();
                row1.bgColor = "#E7EDF1";
                var cell1 = row1.insertCell();
                var cell2 = row1.insertCell();
                cell2.bgColor = "#FFFFFF";
                var cell3 = row1.insertCell();
                var cell4 = row1.insertCell();
                cell4.bgColor = "#FFFFFF";
                cell1.innerHTML = "组织成员:";
                cell2.innerHTML = "<input type=\"text\" name=\"zzcy\" maxlength=\"50\">";
                cell3.innerHTML = "带动农户数:";
                cell4.innerHTML = "<input type=\"text\" name=\"ddnhs\" maxlength=\"50\">";
            }
            else   if (document.form1.b.value == 3)
            {
                略
            }
            else   if (document.form1.b.value == 4)
            {
                略
            }
            isExist = true;    }
    </script>
    </form>
    </BODY>
    </HTML> 此方法就有问题了……
    望告之,再次感谢ls的兄弟热心解答
      

  5.   

    其實再加個參數就可以了:
    <script   type="text/javascript"> 
    isExist   =   false;
    var addRowCount = 0;
    tb   =   document.all.DetailTable;
                    {                 tb   =   document.all.DetailTable; 
                    if   (isExist) 
                    { 
                            for (; i > 0; i--)
                            {
                                   tb.deleteRow();
                            } 
                    } 
                            var   row1   =   tb.insertRow(); 
                            row1.bgColor   =   "#E7EDF1"; 
                            var   cell1   =   row1.insertCell(); 
                            var   cell2   =   row1.insertCell(); 
                            cell2.bgColor   =   "#FFFFFF"; 
                            var   cell3   =   row1.insertCell(); 
                            var   cell4   =   row1.insertCell(); 
                            cell4.bgColor   =   "#FFFFFF"; 
                            var   row2   =   tb.insertRow(); 
                            row2.bgColor   =   "#E7EDF1"; 
                            var   cell5   =   row2.insertCell(); 
                            var   cell6   =   row2.insertCell(); 
                            cell6.bgColor   =   "#FFFFFF"; 
                            var   cell7   =   row2.insertCell(); 
                            var   cell8   =   row2.insertCell(); 
                            cell8.bgColor   =   "#FFFFFF";
                            addRowCount = 2;//可以根據情況修改                 if   (form1.b.value   ==   "1") 
                    { 
                            cell1.innerHTML   =   "畜别:"; 
                            cell2.innerHTML   =   " <select   name=\"xb\"   onchange=\"setPZ()\"> \n"   + 
                                                                "                         <option   value=\"\"> 请选择 </option> \n"   + 
                                                                "                         #foreach($xbobj   in   $xb)\n"   + 
                                                                "                         <option   value=\"$xbobj.id\"> $!xbobj.name </option> \n"   + 
                                                                "                         #end\n"   + 
                                                                "                 </select> "; 
                            cell3.innerHTML   =   "品种:"; 
                            cell4.innerHTML   =   " <select   name=\"pz\"> \n"   + 
                                                                "                         <option   value=\"\"> 请选择 </option> \n"   + 
                                                                "                 </select> ";                         cell5.innerHTML   =   "存栏量:"; 
                            cell6.innerHTML   =   " <input   type=\"text\"   name=\"cunll\"   maxlength=\"50\"> "; 
                            cell7.innerHTML   =   "出栏量:"; 
                            cell8.innerHTML   =   " <input   type=\"text\"   name=\"chull\"   maxlength=\"50\"> "; 
                    } 
                    else   if   (form1.b.value   ==   "2") 
                    { 
                            var   row1   =   tb.insertRow(); 
                            row1.bgColor   =   "#E7EDF1"; 
                            var   cell1   =   row1.insertCell(); 
                            var   cell2   =   row1.insertCell(); 
                            cell2.bgColor   =   "#FFFFFF"; 
                            var   cell3   =   row1.insertCell(); 
                            var   cell4   =   row1.insertCell(); 
                            cell4.bgColor   =   "#FFFFFF"; 
                            cell1.innerHTML   =   "组织成员:"; 
                            cell2.innerHTML   =   " <input   type=\"text\"   name=\"zzcy\"   maxlength=\"50\"> "; 
                            cell3.innerHTML   =   "带动农户数:"; 
                            cell4.innerHTML   =   " <input   type=\"text\"   name=\"ddnhs\"   maxlength=\"50\"> "; 
                    } 
                    else       if   (document.form1.b.value   ==   3) 
                    { 
                            略 
                    } 
                    else       if   (document.form1.b.value   ==   4) 
                    { 
                            略 
                    } 
                    isExist   =   true;         } 
    </script> 
      

  6.   

    把i改成addRowCount,不好意思打錯了
      

  7.   

    你把row1 = tb.insertRow()放在if語句裡不就可以不產生多餘的Row了嗎,這樣也可以少Delete幾行