js联动select

来源：互联网发布：windows 代理服务器编辑：程序博客网时间：2024/04/28 12:13
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!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 runat="server"> <title></title></head><body onload="loadProv()"><select id="prov" onchange="provchange()">    <option  value="none">请选省份 </option> </select><select id="city"></select></body></html><script type="text/javascript">    var data = { "山东": ["济南", "青岛", "北京"], "安徽": ["淮南", "铜陵", "黄山"], "浙江": ["杭州", "宁波", "绍兴"] }    function loadProv() {        var prov = document.getElementById("prov");        for (var key in data) {            var option = document.createElement('option');            option.value = key;            option.innerText = key;            prov.appendChild(option);        }    }    function provchange() {        var prov = document.getElementById("prov");        var city = document.getElementById("city");        var provName = prov.value;        var cities = data[provName];        //city.options.length = 0;        for (var i = city.childNodes.length-1; i >=0 ; i--) {            var option = city.childNodes[i];            city.removeChild(option);        }        var provName = prov.value;        if (provName == "none") {            return;        }            for (var i = 0; i < cities.length; i++) {                var option = document.createElement("option");                option.value = cities[i];                option.innerText = cities[i];                city.appendChild(option);            }    }</script>