JS里实现页面跳转

<select id="identity" name="#">
                <option name="#" id="#" value="admin">管理员</option>
                <option name="#" id="#" value="leader">领导</option>
                <option name="#" id="#" value="staff">员工</option>
                </select>

 有时候我们需要通过一个按钮，或者说一个下拉列表框来实现页面跳转，方法其实有很多，我举一下我常用的方法：

①按钮跳转<input type="button">：

<input type="button" name="#" id="#" onclick="window.location.href='index.html'" />

 

注意:将input设置为button类型，通过onclick（点击触发事件）实现跳转到index.html页面；

②下拉列表框<select>

HTML代码如下：

<select id="identity" name="#">
                <option name="#" id="#" value="admin">管理员</option>
                <option name="#" id="#" value="leader">领导</option>
                <option name="#" id="#" value="staff">员工</option>
                </select>

 

JS代码如下：

 

　<!--
function login(){
	　　var identity=document.getElementById("identity").value;
	if(identity=="admin"){
		window.location.href="../web/admin_main.html";
	}else if(identity=="leader"){
		window.location.href=("../web/leader_main.html");
	}else if(identity=="staff"){
		window.location.href=("../web/staff_main.html");
		}
	}

　　//-->

  根据选择下拉列表框中不同的值，来实现跳转到不同的页面；

注意（自己犯的错）：获取表单的值时，记得在最后面增加.value,比如：getElementById("identity").value

③番外:

如果你在主页面采用了框架(<frame>),跳转页面如果不指定对应的框架，则默认为在当前框架；通常你会遇到这样一个问题，比如你在主页面想退出到登陆页面，你想的是全屏显示登陆页面，然而并非如此，它就在你点击退出的那个框架显示了登录页面，这样显示出来的页面并不完全，想全屏显示，有如下两种方式：

window.parent.location.href="../login/login.html"

 

window.open("../login/login.html","_parent");