编写市下拉框的onchange()事件,滤掉符合的规则的市、县下拉框的option

解决方案 »

  1.   

    可以在数据库中建立一个表 字段名是城市编码和城市名称 然后在下拉框里扫描那张表 再编写onchang()事件
      

  2.   

    从jsp中读取数据库中所有的省市县的代码,存到数组中,例如a[1]='11',b[1]='1101',c[1]='110101',把jsp中定义的数组中的数据对应赋到javascript中定义的数组中,然后写javascript函数,在下拉框的onchange事件中触发相应的onchange函数,即可
      

  3.   

    其实这个挺简单的:例如有三个下拉框,第二个及第三个可以根据第一个框动态的生成。
    方法是通过Microsoft的XMLHTTP:(可以动态的生成如下的select框)
    <div id="Prov">
    <select name="Province" onChange="javascript:Prov(this, document.all.item['City'], document.all.item['County'])">
     <option value="11">广东省</option>
     .......
    </select>
    </div>
    ...
    <div id="City">
    <select name="CityA">
    <option value="1100">广州市</option>
    <option value="1101">深圳市</option>
    ....
    </select>
    </div>
    ...
    <div id="County">
    <select name="CountyA">
    <option value="112311">平安县</option>
    ....
    </select>
    </div>
    ...
     function Prov(rObjA, rObjB, rObjC)
    {
    var lRtn = "";
    var lXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    var lUrl     = "/yourservlet(or your Jsp page which used to get the datas from DB by parameters)?prov="+rObjA.value;
    //alert("lUrl = "+lUrl);
    /*
    关键是你的选数据的方法,在你的servlet里选数据时的sql语句可以根据url带过来的参数
    用between关键词分别可以选出对应市和县,然后按一定的格式输出,例如:
    <root>
    <error>no</error>
    <city>aaa</city>
    <county>bbb</county>
    <county>ccc</county>
    ...
    </root> 你也可以给元素加上属性,以便让他们对应,例如:
    <city id="1100">广州市</city>
    <county id="110001">东山区</county>
    <county id="110002">天河区</county>
    ......
    这样你动态生成下拉框时只要做一些判别就可以一一对应了。
    下面的例子我没有做判别。
    */ lXmlHttp.open("GET", lUrl, false);
    lXmlHttp.send();
    try
    {
        lRtn = lXmlHttp.responseText;//
    }
    catch(exception)
    {
    if(exception.description=='系统错误: -1072896748。')
    lRtn = "";
    }
    //alert("lRtn = "+lRtn);
    if(lRtn == null && lRtn=="") return false;
                    var lXmlDoc = setXmlObj(lRtn);
    var lErrorElem = lXmlDoc.getElementsByTagName("error");
    for(var i=0; i<lErrorElem.length; i++)
    {
        if(lErrorElem[i].text != "no")
    {
    alert(lErrorElem[i].text);
    return false;
    }
    }
           
    var lCityElem = lXmlDoc.getElementsByTagName("city");
    var lCityStr = "";
    var lCityArr = new Array(lCityElem.length);
    for(var i=0; i<lCityElem.length; i++)
    {
        if(!(lCityElem.hasChildNodes))
        {
    //alert(""+lCityElem[i].nodeName);
    //alert(""+lCityElem[i].text);
        if(lCityElem[i].text != null)
    {
                                     //lCityStr += lCityElem[i].text+",";
     lCityArr[i] = lCityElem[i].text;
     lCityStr += "<option value='"+lCityElem[i].getAttribute("id")+"'>"+lCityElem[i].text+"</option>";
    }
        }
    }
    alert("lCityStr="+lCityStr);
                    rObjB.innerHTML = "<select name=\"CityA\">"+lCityStr+"</select>";                var lCountyStr = "";
    var lCountyElem = lXmlDoc.getElementsByTagName("county");
    var lCountArray = new Array(lCountyElem.length);
    for(var i=0; i<lCountyElem.length; i++)
    {
        lCountyArray[i] = lCountyElem[i].text;     
        lCountyStr += "<option value='"+lCountyElem[i].getAttribute("id")+"'>"+llCountyElem[i].text+"</option>";
    }
            alert("lCountyStr="+lCountyStr);
                    rObjC.innerHTML = "<select name=\"CountyA\">"+lCountyStr+"</select>"; return true;
    } function setXmlObj(sXml){
    var xmlDoc= new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async = false;
    //alert(sXml);
    xmlDoc.loadXML(sXml);
    return xmlDoc;
           }
      

  4.   

    附:
    这段代码我没有测试过,不过大概的过程应该没什么大的问题,关键是他从数据库选数据的sql语句。
      

  5.   

    建议两个<select>就行了,一个省也就60-70个县,可以放到一个select中的!