通过事件实时获取<select>标签选项时需要注意的问题
通过查询各种资料，找到了一种解决方法（肯定还有其他方式……），就是：首先获取已经选择的选项下标，下标通常是从0开始，这里就不多赘述了，学过变成的小伙伴肯定都知道，获取下标后还没有完成，我们需要根据下标获取该下标对应选项中的value值，正如以下代码所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<script type="text/JavaScript">
function province() {
var index = document.getElementById("ps").selectedIndex;
var p = document.getElementById("ps").options[index].value;
var c = document.getElementById("c").options;
console.log(p);
c.length = 0;
c.add(new Option("-请选择-", "-请选择-"));
if (p == "山东省") {
console.log("shandong");
c.add(new Option("济南", "济南"));
c.add(new Option("潍坊", "潍坊"));
}
if (p == "浙江省") {
console.log("zhejiang");
c.add(new Option("杭州", "杭州"));
c.add(new Option("宁波", "宁波"));
}
}
</script>
<body>
<span>省份</span>
<select id="ps" onchange="province()">
<option selected="selected">-请选择-</option>
<option value="山东省">山东省</option>
<option value="浙江省">浙江省</option>
</select>
<span>市区</span>
<select id="c">
<option selected="selected">-请选择-</option>
</select>
</body>
</html>在以上代码的第11行和第12行中，首先获取了id名为“ps”的元素（也就是select）的已选中的选项下标，然后再根据下标获取到该选项的value值，其实可以直接把赋值给变量index的那段表达式直接放到第12行的index的位置，只是因为看起来不明了，所以我在这里分开写了。
http://www.ssnd.com.cn 化妆品OEM代加工
总结：
//获取select标签已选中的选项下标
var index = document.getElementsById("<select>标签的id").selectedindex;
//根据选项下标获取对应选项的value值
var selectedvalue = document.getElementsById("<select>标签的id").options[index].value;最后，虽然解决了问题，但是我还是觉得这种写法有些麻烦，所以，有时间会继续寻找更加简洁且高效的写法。
