请问如何用ajax制作下拉筛选(本地数据,不连数据库)

图片说明
请大神贴码,谢谢!

额。。。。。。。。。。。。。。。。。。。

你是想根据什么排序筛选 说清楚点好吗 , 是根据两个select框的值做筛选的话,把筛选条件也列出来好吗?

** 这个应该是可以的 ajax 部分填写上自己的有数据访问地址就可以了 **

 <html>  
<head>  
<title></title>  
<script>  
//定义 城市 数据数组  
cityArray = new Array();  
cityArray[0] = new Array("河南省","-请选择-|郑州市|开封市|洛阳市|平顶山市|安阳市|鹤壁市|新乡市|焦作市|濮阳市|许昌市|漯河市|三门峡市|南阳市|商丘市|信阳市|周口市|驻马店市|济源市");  
cityArray[1] = new Array("云南省","-请选择-|昆明市|大理市|曲靖市|玉溪市|昭通市|楚雄市|红河市|文山市|思茅市|西双版纳市|保山市|德宏市|丽江市|怒江市|迪庆市|临沧市");  

function getOptions(currProvince)  
{  
    var currProvince = currProvince;  
    var i,j,k;  
    document.all.selVal.length = 0 ;  
    for (i = 0 ;i <cityArray.length;i++)  
    {  
        if(cityArray[i][0]==currProvince)  
        {  
            var tmpcityArray = cityArray[i][1].split("|")
            for(j=0;j<tmpcityArray.length;j++)  
            {  
                document.all.selVal.options[document.all.selVal.length] = new Option(tmpcityArray[j],tmpcityArray[j]);  
            }  
        }  
    }  
}
function getData(selectValues){
    console.log(selectValues);
    if (window.XMLHttpRequest) 
        xmlhttp=new XMLHttpRequest(); 
    else 
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

        xmlhttp.onreadystatechange=callbacksuccess    //回调函数
        xmlhttp.open('get',url,true);     //发送ajax get方式 url 拼接
        xmlhttp.send(); 
    }

    if (xmlhttp.readyState==4 && xmlhttp.status==200){
        var data = JSON.parse(xmlhttp.responseText);
        var fragment = document.createDocumentFragment();
        for(var i = 0; i < data; i++) {
            var spanNode = document.createElement("li");
            spanNode.innerHTML = "item"+i;
            fragment.appendChild(spanNode);
        }
        document.getElementById("lists").appendChild(spanNode);
    }
}
</script>  
</head>  
<body>  
    <select id="selProvince" onChange = "getOptions(this.options[this.selectedIndex].value)">   
        <option value="河南省">河南省</option>  
        <option value="云南省">云南省</option>  
    </select>  

    <select id="selVal" onChange="getData(this.options[this.selectedIndex].value)">  
        <option>-请选择-</option>  
    </select>  
    <div id="lists"></div>
</body>  
</html>  

你是直接搜索html中的内容?符合上面选择的条件就显示出来那就不需要ajax