版权声明：俗世凡人行(释) QQ:748507607 https://blog.csdn.net/weixin_41887155/article/details/88727426
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>下拉框</title>
</head>
<body>
书籍分类:
<select id="s1" >
<option value="1">教学类</option>
<option value="2">技术类</option>
<option value="3">科学类</option>
<option value="4">文学类</option>
</select>
<button>点击</button>
</body>
</html>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
$("button").click(function(){
//获取下拉框的对象
var select = document.getElementById("s1");
//获取当前选中的值,这个已经可以满足大多数传递参数value的需要
var value = select.value;
//获得该下拉框所有的option的节点对象,得到的options是一个对象数组
var options = select.options;
//如何获得第几个option的value值?比如我要获取第一option的value,可以这样
var value1 = options[0].value;
//如何获得第几个option的文本内容?比如我要获取第一option的文本,可以这样：
var text1 = options[0].text;
//如何获得当前选中的option的索引
var index = select.selectedIndex;
//如何获得当前选中的option的文本内容,这个也经常用
var selectedText = options[index].text;
alert(selectedText);
});
</script>