如何动态获取select下拉框的value值(反复排雷之后的做法，亲测有效哦) |
您所在的位置：网站首页 › 下拉框怎么测试出来 › 如何动态获取select下拉框的value值(反复排雷之后的做法，亲测有效哦) |
如何动态获取select下拉框的value值(反复排雷之后的做法，亲测有效哦)
|
需求：
点击一个option，可以获取对应的value值。 效果：
这里重点是确定在什么时候获得indexs，我选择的是当select的值发生改变的时候。 我爱 老公 宝贝 猪猪 小可耐 var selects = document.getElementById("select"); selects.onchange = function () { var indexs = selects.selectedIndex; //选中项的索引 console.log(selects.options[indexs].value); } 踩雷：1.这个方法始终获取到的是第一个option的索引，而且不会变。 我爱 老公 宝贝 猪猪 小可耐 var indexs = selects.selectedIndex; //选中项的索引 console.log(selects.options[indexs].value);这里我是用了一个延迟来看出问题的：这样会在还没到时间之前点击option来获取对应value 我爱 老公 宝贝 猪猪 小可耐 setTimeout(() => { var indexs = selects.selectedIndex; //选中项的索引 console.log(selects.options[indexs].value); console.log(selects.options[indexs].text); }, 6000)2.使用onclick触发事件，这样也是一直输出第一个 我爱 老公 宝贝 猪猪 小可耐 var selects = document.getElementById("select"); selects.onclick = function () { var indexs = selects.selectedIndex; //选中项的索引 console.log(selects.options[indexs].value); } |
【本文地址】
今日新闻 |
推荐新闻 |