独角兽企业重金招聘Python工程师标准>>>
使用js完成省市二级联动
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>使用js完成省市二级联动</title><script>var cities = new Array(4);cities[0] = new Array("武汉市", "黄冈市", "襄阳市", "荆州市");cities[1] = new Array("长沙市", "株洲市", "岳阳市");cities[2] = new Array("石家庄市", "邯郸市", "廊坊市", "保定市");cities[3] = new Array("安阳市", "洛阳市", "开封市", "安阳市");function selectCity(value) {var cityEle = document.getElementById("city");cityEle.options.length = 0;for (var i = 0; i < cities.length; i++) {if (value == i) {for (var j = 0; j < cities[i].length; j++) {var textNode = document.createTextNode(cities[i][j]);var opEle = document.createElement('option');opEle.appendChild(textNode);cityEle.appendChild(opEle);}}}}</script></head><body><tr><td>籍贯</td><td><select onchange="selectCity(this.value)"><option>---请选择---</option><option value="0">湖北</option><option value="1">湖南</option><option value="2">河北</option><option value="3">河南</option></select><select id="city"></select></td></tr></body></html>
使用jquery完成省市二级联动
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>使用jquery完成省市二级联动</title><script type="text/javascript" src="js/jquery-3.3.1.js"></script><script>$(function() {var cities = new Array(4);cities[0] = new Array("武汉市", "黄冈市", "襄阳市", "荆州市");cities[1] = new Array("长沙市", "株洲市", "岳阳市");cities[2] = new Array("石家庄市", "邯郸市", "廊坊市", "保定市");cities[3] = new Array("安阳市", "洛阳市", "开封市", "安阳市");$("#province").change(function() {$("#city").empty();var val = this.value;$.each(cities, function(i,n) {if (val == i) {$.each(cities[i], function(j, m) {var textNode = document.createTextNode(m);var opEle = document.createElement("option");$(opEle).append(textNode);$(opEle).appendTo($("#city"));});}});});});</script></head><body><tr><td>籍贯</td><td><select id="province"><option>---请选择---</option><option value="0">湖北</option><option value="1">湖南</option><option value="2">河北</option><option value="3">河南</option></select><select id="city"></select></td></tr></body></html>
