select下拉菜单跳转效果代码
分类：实例代码
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=initForm;
function initForm(){
document.getElementById("newLocation").selectIndex=0;
document.getElementById("newLocation").onchange=jumpPage;
}
function jumpPage(){
var newLoc=document.getElementById("newLocation");
var newPage=newLoc.options[newLoc.selectedIndex].value;
if(newPage!=""){
window.location=newPage;
}
}
</script>
</head>
<body>
<form>
<select id="newLocation">
<option selected="selected" value="">蚂蚁u币罗</option>
<option value="http://www.pipipi.net">奋斗才会成功</option>
<option value="http://www.pipipi.net">等待是没有结果的</option>
<option value="http://www.pipipi.net">现在就执行</option>
<option value="http://www.pipipi.net">开始行动吧</option>
</select>
</form>
</body>
</html>
以上代码实现了我们想要的功能，选中下拉项可以实现跳转功能。
select下拉菜单跳转效果代码，这样的场景在实际项目中还是用的比较多的，关于select下拉菜单跳转效果代码就介绍到这了。