JS下拉菜单实现div的隐藏和显示
发布时间 | 2018/9/20 点击 | 次
方案一:
<select id="test_select">
<option value="1">显示</option>
<option value="2">隐藏</option>
</select>
<div id="test">www.my0553.cn</div>
window.onload = function(){
var obj_select = document.getElementById("test_select");
var obj_div = document.getElementById("test");
obj_select.onchange = function(){
obj_div.style.display = this.value==1? "block" : "none";
}
}
方案二:
function choose(sel){
if(sel.value=='1')
{
document.getElementById('test').style.display='block';
}
else if(sel.value=='2')
{
document.getElementById('test').style.display='none';
}
};
<div id="test">www.my0553.cn</div>
<select name="sel" onchange='choose(this);'>
<option value="1">A</option>
<option value="2">B</option>
</select>