省市联动 

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript">
        function Start() {
            var pDatas = ['请选择省份…', '广东省', '湖北省', '湖南省', '广西省'];
            initPNodeData(pDatas);
        }
        function initPNodeData(pDatas) {
            var pNodes = document.getElementById('pNodes');
            for (var i = 0; i < pDatas.length; i++) {
                var item = document.createElement('option');//创建节点
                item.innerHTML = pDatas[i];
                pNodes.appendChild(item);//添加节点
                document.inser
            }
            //pNodes.onchange = selectChange;
        }
 
        function selectChange(pNodes) {
            alert(pNodes.id);
            var cityDatas = [['请选择城市…'], ['佛山', '广州', '深圳', '江门'], ['武汉', '孝感', '应城', '随州', '襄樊'], ['岳阳', '长沙', '衡阳', '湘潭'], ['桂林', '南宁', '北海']];
            var nodes = cityDatas[pNodes.selectedIndex];
            var citys = document.getElementById("citys");
 
            //清空
            var oldNodes = citys.childNodes;
            for (var i = 0; i < citys.length;) {
                citys.removeChild(oldNodes[i]);
            }
 
            for (var i = 0; i < nodes.length; i++) {
                var item = document.createElement('option');
                item.innerHTML = nodes[i];
                citys.appendChild(item);
            }
        }
    </script>
</head>
<body onload="Start()">
    省份:<select id="pNodes" onchange="selectChange(this)"></select>
    城市:<select id="citys"></select>
</body>
</html>




posted @ 2014-11-29 20:33  勇天  阅读(108)  评论(0)    收藏  举报