新增多行与原来一摸一样的下拉联动列表

<html>
<head>
<title>List</title>
<meta http-equiv="Content-Type" content="text/html; c
harset=gb2312">
<script defer LANGUAGE="javascript">
<!--
var onecount;
onecount=0;subcat = new Array();
subcat[0] = new Array("徐汇区","01","001");
subcat[1] = new Array("嘉定区","01","002");
subcat[2] = new Array("黄浦区","01","003");
subcat[3] = new Array("南昌市","02","004");
subcat[4] = new Array("九江市","02","005");
subcat[5] = new Array("上饶市","02","006");onecount=6;function changelocation(locationid){
document.myform.smalllocation.length = 0; var locationid=locationid;
var i;
document.myform.smalllocation.options[0] = new Option('====所有地区====','');
for (i=0;i <onecount; i++){
if (subcat[i][1] == locationid){
document.myform.smalllocation.options[document.myform.smalllocation.length]
= new Option(subcat[i][0], subcat[i][2]);
}
}}/**function getSelect1(){

 var Myform=document.getElementById('myform');
 
 var Myfieldset=document.createElement("fieldset");
 var Myselect1=document.createElement("select");
 var Myselect2=document.createElement("select");
 var Myoption1=document.createElement("option");
 var Myoption2=document.createElement("option");
 var Myinput=document.createElement("input");
 
 Myselect1.options.add(new Option("text","value")); 
 Myselect1.options.add(new Option("text1","value")); 
 Myinput.setAttribute("type","text") 
 Myinput.setAttribute("size","30") 
 Myinput.setAttribute("name","SearchTxt") 
 
 Myselect1.appendChild(Myoption1) 
 Myselect2.appendChild(Myoption2)  
 Myfieldset.appendChild(Myselect1) 
 Myfieldset.appendChild(Myselect2) 
 Myfieldset.appendChild(Myinput) 
 Myform.appendChild(Myfieldset) 
 
}*/
function getSelect1(){
alert("****")
 var Myform=document.getElementById('myform');
 var Myfieldset=document.createElement("fieldset")
 Myfieldset.innerHTML="<select name="biglocation" onChange="changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)"><option value="01" selected>上海</option><option value="02">江西</option></select><select name="smalllocation"><option selected value="">==所有地区==</option></select><input type="text" name="SearchTxt" size="30" id="SearchTxt" />&nbsp&nbsp<input type="button" class="input-btn"  value="add" onclick="getSelect1()"/>"
 Myform.appendChild(Myfieldset)
      alert("%%%%%%")
}//-->
</script>
</head>
<body>
<form id="myform" name="myform" method="post">
<fieldset id="myfieldset">
<select name="biglocation"
onChange="changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)">
<option value="01" selected>上海</option>
<option value="02">江西</option>
</select>
<select name="smalllocation">
<option selected value="">==所有地区==</option>
</select>
<input type="text" name="SearchTxt" size="30" id="SearchTxt" />&nbsp&nbsp&nbsp;
</fieldset>
<input type="button" class="input-btn"  value="add" onclick="getSelect1()"/>&nbsp;</form>
<script LANGUAGE="javascript">
<!--
changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value);
//-->
</script>
</body>
</html>
在别人代码基础上改的innerHtmlonchage新增多行一模一样联动下拉列表类似于在线注册简历的新增教育背景

解决方案 »

  1.   


    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script defer LANGUAGE="javascript">
    <!--
    var onecount=0;subcat = new Array();
    subcat[0] = new Array("徐汇区","01","001");
    subcat[1] = new Array("嘉定区","01","002");
    subcat[2] = new Array("黄浦区","01","003");
    subcat[3] = new Array("南昌市","02","004");
    subcat[4] = new Array("九江市","02","005");
    subcat[5] = new Array("上饶市","02","006");onecount=6;function changelocation(locationid){
    document.myform.smalllocation.length = 0; var locationid=locationid;
    var i;
    document.myform.smalllocation.options[0] = new Option('====所有地区====','');
    for (i=0;i <onecount; i++){
    if (subcat[i][1] == locationid){
    document.myform.smalllocation.options[document.myform.smalllocation.length]= new Option(subcat[i][0], subcat[i][2]);
    }
    }
    }
    function getSelect1(){
    alert("****");
      var Myform=document.getElementById('myform');
      var Myfieldset=document.createElement("fieldset");
      Myfieldset.innerHTML="<select name=\"biglocation\" onChange=\"changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)\"><option value=\"01\" selected>上海</option><option value=\"02\">江西</option></select><select name=\"smalllocation\"><option selected value=\"\">==所有地区==</option></select><input type=\"text\" name=\"SearchTxt\" size=\"30\" id=\"SearchTxt\" />&nbsp&nbsp<input type=\"button\" class=\"input-btn\"  value=\"add\" onclick=\"getSelect1()\"/>";
      Myform.appendChild(Myfieldset);
        alert("%%%%%%");
    }//-->
    </script>
    </head>
    <body>
    <form id="myform" name="myform" method="post">
    <fieldset id="myfieldset">
    <select name="biglocation"
    onChange="changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)">
    <option value="01" selected>上海</option>
    <option value="02">江西</option>
    </select>
    <select name="smalllocation">
    <option selected value="">==所有地区==</option>
    </select>
    <input type="text" name="SearchTxt" size="30" id="SearchTxt" />&nbsp&nbsp&nbsp;
    </fieldset>
    <input type="button" class="input-btn"  value="add" onclick="getSelect1()"/>&nbsp;</form>
    <script LANGUAGE="javascript">
    <!--
    changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value);
    //-->
    </script>
    </body>
    </html>双引号中的双引号要转义
      

  2.   

    <script defer LANGUAGE="javascript">
    <script LANGUAGE="javascript">最好用<script type="text/javascript">
      

  3.   

    你用什么浏览器？什么版本？我用ie10,firefox23,chrome27都可以用呀
      

  4.   


    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script defer LANGUAGE="javascript">
    <!--
    var onecount=0;subcat = new Array();
    subcat[0] = new Array("徐汇区","01","001");
    subcat[1] = new Array("嘉定区","01","002");
    subcat[2] = new Array("黄浦区","01","003");
    subcat[3] = new Array("南昌市","02","004");
    subcat[4] = new Array("九江市","02","005");
    subcat[5] = new Array("上饶市","02","006");onecount=6;function changelocation(locationid,selectE){
    selectE.length = 0; var locationid=locationid;
    var i;
    selectE.options[0] = new Option('====所有地区====','');
    for (i=0;i <onecount; i++){
    if (subcat[i][1] == locationid){
    selectE.options[selectE.length]= new Option(subcat[i][0], subcat[i][2]);
    }
    }
    }
    function getSelect1(){

      var Myform=document.getElementById('myform');
      var Myfieldset=document.createElement("fieldset");
      Myfieldset.innerHTML="<select onChange=\"changelocation(this.options[this.selectedIndex].value,this.nextSibling)\"><option value=\"01\" selected>上海</option><option value=\"02\">江西</option></select><select><option selected value=\"\">==所有地区==</option></select><input type=\"text\" name=\"SearchTxt\" size=\"30\" id=\"SearchTxt\" />&nbsp&nbsp<input type=\"button\" class=\"input-btn\"  value=\"add\" onclick=\"getSelect1()\"/>";
      Myform.appendChild(Myfieldset);
        
    }//-->
    </script>
    </head>
    <body>
    <form id="myform" name="myform" method="post">
    <fieldset id="myfieldset">
    <select name="biglocation"
    onChange="changelocation(this.options[this.selectedIndex].value,this.nextSibling)"><option value="01" selected>上海</option><option value="02">江西</option></select><select name="smalllocation"><option selected value="">==所有地区==</option></select>
    <input type="text" name="SearchTxt" size="30" id="SearchTxt" />&nbsp&nbsp&nbsp;
    </fieldset>
    <input type="button" class="input-btn"  value="add" onclick="getSelect1()"/>&nbsp;</form>
    <script LANGUAGE="javascript">
    <!--
    changelocation(window.myform.biglocation.options[window.myform.biglocation.selectedIndex].value,window.myform.smalllocation);
    //-->
    </script>
    </body>
    </html>
      

  5.   


    你点add后新生成的 
    原来没试add生成的select联动功能.试试17楼的.如果希望在add时初始化select2,就不能用innerHTML
      

  6.   

    Quote: 引用 17 楼 xiaofanku 的回复:

    你是我的大神呢  太美了
      

  7.   


    你点add后新生成的 
    原来没试add生成的select联动功能.试试17楼的.如果希望在add时初始化select2,就不能用innerHTML不过17楼可以 
      

  8.   


    你点add后新生成的 
    原来没试add生成的select联动功能.试试17楼的.如果希望在add时初始化select2,就不能用innerHTML那一般用什么
      

  9.   


    function getSelect1(){

      var Myform=document.getElementById('myform');
      var Myfieldset=document.createElement("fieldset");
      //Myfieldset.innerHTML="<select onChange=\"changelocation(this.options[this.selectedIndex].value,this.nextSibling)\"><option value=\"01\" selected>上海</option><option value=\"02\">江西</option></select><select><option selected value=\"\">==所有地区==</option></select><input type=\"text\" name=\"SearchTxt\" size=\"30\" id=\"SearchTxt\" />&nbsp&nbsp<input type=\"button\" class=\"input-btn\"  value=\"add\" onclick=\"getSelect1()\"/>";

    var s1=document.createElement('select');
    s1a=document.createAttribute('onchange');
    s1a.nodeValue ="changelocation(this.options[this.selectedIndex].value,this.nextSibling)";
    s1.setAttributeNode(s1a);
    s1.innerHTML="<option value=\"01\" selected>上海</option><option value=\"02\">江西</option>";
    Myfieldset.appendChild(s1);

    var s2=document.createElement('select');
    s1op=document.createElement('option');
    s1op.value= "";
    s1op.text= "==所有地区==";
    s2.appendChild(s1op);

    Myfieldset.appendChild(s2);
    //...
      Myform.appendChild(Myfieldset);
        
    }
      

  10.   


    function getSelect1(){

      var Myform=document.getElementById('myform');
      var Myfieldset=document.createElement("fieldset");
      //Myfieldset.innerHTML="<select onChange=\"changelocation(this.options[this.selectedIndex].value,this.nextSibling)\"><option value=\"01\" selected>上海</option><option value=\"02\">江西</option></select><select><option selected value=\"\">==所有地区==</option></select><input type=\"text\" name=\"SearchTxt\" size=\"30\" id=\"SearchTxt\" />&nbsp&nbsp<input type=\"button\" class=\"input-btn\"  value=\"add\" onclick=\"getSelect1()\"/>";

    var s1=document.createElement('select');
    s1a=document.createAttribute('onchange');
    s1a.nodeValue ="changelocation(this.options[this.selectedIndex].value,this.nextSibling)";
    s1.setAttributeNode(s1a);
    s1.innerHTML="<option value=\"01\" selected>上海</option><option value=\"02\">江西</option>";
    Myfieldset.appendChild(s1);

    var s2=document.createElement('select');
    s1op=document.createElement('option');
    s1op.value= "";
    s1op.text= "==所有地区==";
    s2.appendChild(s1op);

    Myfieldset.appendChild(s2);
    //...
      Myform.appendChild(Myfieldset);
        
    }

    这个还有点bug 新增的必须先点击江西第二个下拉列表才会显示内容
      

  11.   


    function getSelect1(){

      var Myform=document.getElementById('myform');
      var Myfieldset=document.createElement("fieldset");
      //Myfieldset.innerHTML="<select onChange=\"changelocation(this.options[this.selectedIndex].value,this.nextSibling)\"><option value=\"01\" selected>上海</option><option value=\"02\">江西</option></select><select><option selected value=\"\">==所有地区==</option></select><input type=\"text\" name=\"SearchTxt\" size=\"30\" id=\"SearchTxt\" />&nbsp&nbsp<input type=\"button\" class=\"input-btn\"  value=\"add\" onclick=\"getSelect1()\"/>";

    var s1=document.createElement('select');
    s1a=document.createAttribute('onchange');
    s1a.nodeValue ="changelocation(this.options[this.selectedIndex].value,this.nextSibling)";
    s1.setAttributeNode(s1a);
    s1.innerHTML="<option value=\"01\" selected>上海</option><option value=\"02\">江西</option>";
    Myfieldset.appendChild(s1);

    var s2=document.createElement('select');
    s1op=document.createElement('option');
    s1op.value= "";
    s1op.text= "==所有地区==";
    s2.appendChild(s1op);

    Myfieldset.appendChild(s2);
    //...
      Myform.appendChild(Myfieldset);
        
    }

    这个还有点bug 新增的必须先点击江西第二个下拉列表才会显示内容你是一点不会写吗？我只是写个架子，你照着写就可以，还非得让我一点不落的都写出来
      

  12.   


            //...
            s2.appendChild(s1op);
    var co=s1.options[s1.selectedIndex].value;
    for(var m=0;m<subcat.length;m++){
    if (subcat[m][1] == co){

    mop=document.createElement('option');
    mop.value= subcat[m][0];
    mop.text= subcat[m][0];
    s2.appendChild(mop);
    }
    }
            Myfieldset.appendChild(s2);
            //...