如何通过js动态设置select中option选中

JavaScript0150

如何通过js动态设置select中option选中,第1张

获取select标签,设置它的value值和option的value值相同

<select name="" id="test" value="one">

<option value="one">one</option>

<option value="two">two</option>

</select>

<button id="btn">改变选中状态</button>

<script type="text/javascript">

var select = document.querySelector('#test')

var btn = document.querySelector('#btn')

btn.onclick = function () {

if (select.value === 'one') {

select.value = 'two'

} else {

select.value = 'one'

}

}

</script>

访问数据之前,你肯定要传入一个下拉的value进去,在跳转回来之后,再获取这个值,然后循环遍历这个下拉所有option,去判断,如果options[i]==这个值,就selected='selected':

<html>

<head>

<script>

window.onload = function(){

var opts = document.getElementById("select")

var value = //这个值就是你获取的值

if(value!=""){

for(var i=0i<opts.options.lengthi++){

if(value==opts.options[i].value){

opts.options[i].selected = 'selected'

alert(opts.options[i].value)

break

}

}

}

}

</script>

</head>

<body>

<select id="select">

<option value="1">一</option>

<option value="2">二</option>

<option value="3">三</option>

</select>

</body>

</html>