欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

原生js获取form表单select中option的value值

程序员文章站 2022-03-27 18:57:40
...
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>点击获取option的value值</title>
</head>
<body>
    <form action="">
        <select id="sel">
            <option value="2020">2020年</option>
            <option value="2019">2019年</option>
            <option value="2018">2018年</option>
        </select>
        <div>2020</div>
    </form>
    <script>
        //获取select标签
        var sel = document.querySelector('#sel')
        //添加点击事件
        sel.onclick = function () {
            //获取option标签的下标
            var ind = sel.selectedIndex
            //获取option的value值
            var val = sel[ind].value
            console.log(val)
        }
    </script>
</body>
</html>