一个简单的select框

原创 天蓬元帅 随笔 学习用 365阅读 2017-05-19 07:59:14 举报

<html>

<head>
<style>
select {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
width: 30%;
height: 35px;
background: #333333;
color: #fff;
font-size: 1.5em;
padding: 0 13rem;
height: 60px;
}
</style>
</head>

<body>
<select name="" id="sel" onchange="getOptions();">
<option value="">set Gbk</option>
<option value="">set Utf8</option>
</select>
<p id="demo"></p>
<!-- js-->
<script>
// 定义的一个函数
function getOptions() {
// 获取当前获取的index
var x = document.getElementById("sel").selectedIndex;
// 获取当前sel下的options
var y = document.getElementById("sel").options;
// 显示
var text = document.getElementById("demo");
// 输出
text.innerHTML = "索引: " + y[x].index + "键名" + y[x].text;
}
</script>
</body>

</html>

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复