Form,选择并转移导航菜单

1、代码实例

<!DOCTYPE html>
<html>
<head>
<title>选择并转移导航菜单</title>
<meta charset="utf-8">
</head>
<body>
<form method="post" action="select.html">
<select id="newLocation">
<option selected>select a topic</option>
<option value="script01.html">javascript</option>
<option value="script02.html">jquery</option>
<option value="script03.html">jquery mobile</option>
<option value="script04.html">html5</option>
<option value="script05.html">css3</option>
</select>
</form>
</body>
</html> <script type="text/javascript">
window.onload = init;
window.unload = function(){};
function init(){
document.getElementById("newLocation").selectedIndex = ;
console.log(document.getElementById("newLocation").options);
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>

2、重点分析:

  2.1、window.onunload = function(){}:

    onunload 事件在用户退出页面时发生;

    Form,选择并转移导航菜单

  2.2、selectedIndex:

selectedIndex 属性可设置或返回下拉列表中被选选项的索引号。

注释:若允许多重选择,则仅会返回第一个被选选项的索引号。

  2.3、options:

    删除被选中的项
    objSelect.options[objSelect.selectedIndex] = null;

    增加项

    objSelect.options[objSelect.length] = new Option("你好","hello");

    修改所选择中的项
    objSelect.options[objSelect.selectedIndex] = new
Option("你好","hello");

    得到所选择项的文本

    objSelect.options[objSelect.selectedIndex].text;

    得到所选择项的值

    objSelect.options[objSelect.selectedIndex].value; 

上一篇:Java Method Area


下一篇:poj 2159 D - Ancient Cipher 文件加密