JavaScript动态设置select下拉菜单默认选项

快乐打工仔 分类:实例代码

JavaScript动态设置select下拉菜单默认选项属于前端实例代码,有关更多实例代码大家可以查看

本章节介绍一下如何利用javascript设置select下拉菜单的选中项。

代码实例如下:

<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.pipipi.net/" />  
<title>犀牛前端部落</title>  
<script type="text/javascript"> 
window.onload=function(){ 
  var osel=document.getElementById("sel"); 
  var opts=osel.getElementsByTagName("option");
  var obt=document.getElementById("bt");
  obt.onclick=function(){
    opts[3].selected=true;
  }
} 
</script> 
</head> 
<body> 
<select name="sel" id="sel"> 
<option value="0">犀牛前端部落一</option> 
<option value="1">犀牛前端部落二</option> 
<option value="2" selected>犀牛前端部落三</option> 
<option value="3">犀牛前端部落四</option>
<option value="4">犀牛前端部落五</option>  
</select> 
<input type="button" id="bt" value="查看效果"/>
</body> 
</html>

点击按钮可以设置select下拉菜单的默认选中项。

JavaScript动态设置select下拉菜单默认选项,这样的场景在实际项目中还是用的比较多的,关于JavaScript动态设置select下拉菜单默认选项就介绍到这了。

回复

我来回复
  • 暂无回复内容