<body> <select id="province" οnchange="func1(this)" > </select> <select id="city"></select> </body> <script> data = {"广东省":["广州","佛山"],"北京":["海淀","廊坊"], "海南省":["三亚","海口"]}; var pro = document.getElementById("province"); var city = document.getElementById("city");
for (var i in data){ var option_pro = document.createElement("option"); option_pro.innerHTML=i; pro.appendChild(option_pro); }
function func1(self){ //console.log((self.options[self.selectedIndex]).innerHTML); var choice = (self.options[self.selectedIndex]).innerHTML;
var options = city.children; for (var k=0; k<options.length; k++){ city.removeChild(options[k--]); }
for (var i in data[choice]){ var option_city = document.createElement("option"); option_city.innerHTML = data[choice][i]; city.appendChild(option_city); } } </script>
参考:https://www.cnblogs.com/klvchen/p/10364333.html
var china = [ { "p_name": "吉林省", "p_id": "jl", "cities": [ { "c_name": "长春", "c_id": "cc" }, { "c_name": "四平", "c_id": "sp" }, { "c_name": "通化", "c_id": "th" }, { "c_name": "松原", "c_id": "sy" } ] },{ "p_name": "上海市", "p_id": "sh", "cities": [ { "c_name": "闵行区", "c_id": "mh" }, { "c_name": "徐汇区", "c_id": "xh" }, { "c_name": "黄浦区", "c_id": "hp" }, { "c_name": "浦东新区", "c_id": "pd" } ] } ];
<html> <head> <title>二级联动</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> </head> <body> <select id="province" name="province"> <option value="none">--请选择省--</option> </select> <select id="city" name="city"> <option value="none">--请选择市--</option> </select> <!-- 载入省市数据 --> <script type="text/javascript" src="cities.js"></script> <script type="text/javascript" > //获得省级下拉框对象 var province = document.getElementById("province"); //遍历省市数据,并把里面省的数据追加到option选项中 for (var i=0; i<china.length; i++) { var option = document.createElement("option"); option.value = china[i].p_id; option.innerHTML = china[i].p_name; province.appendChild(option); } //省级下拉框发生改变事件 province.onchange = function() { //获取当前点击对象的值 var proid = this.value; var cities; //遍历省市数据,把省级下点击的那一个选项的值和省市数据中的 //省级数据对比,如果相等,取出当前的市的数据 for (var i=0; i<china.length; i++) { if (proid == china[i].p_id) { cities = china[i].cities; } } //获得市级下拉框对象 var city = document.getElementById("city"); //每次点击省级后,市级初始化,避免高级重复追加 city.innerHTML = "<option value='none'>--请选择市--</option>"; //遍历市级数据,并取出市级数据,追加到市级对象中 for (var i=0; i<cities.length; i++) { var option = document.createElement("option"); option.innerHTML = cities[i].c_name; option.value = cities[i].c_id; city.appendChild(option); } } </script> </body> </html>
https://www.cnblogs.com/loveyous/p/7492674.html
var obj = document.getElementById(”testSelect”); //定位id
var index = obj.selectedIndex; // 选中索引
var text = obj.options[index].text; // 选中文本
var value = obj.options[index].value; // 选中值
jQuery中获得选中select值
第一种方式 $('#testSelect option:selected').text();//选中的文本
$('#testSelect option:selected') .val();//选中的值
$("#testSelect ").get(0).selectedIndex;//索引
第二种方式 $("#tesetSelect").find("option:selected").text();//选中的文本 …….val(); …….get(0).selectedIndex;
//展示函数
var showResult=function(v){
var showLabel=document.getElementById("functioncode");
for(var i=0;i<showLabel.length;i++){
if(showLabel[i].value==v){
showLabel[i].selected="selected";
}
}
};