location.href页面不跳转解决方案,附加加两个小案例

关于window.location.href 不跳转做了一些小总结

首先说跳转的条件，在<a>标签中

首先要要求 a 标签如下：

<a onclick="函数名（）" href="javascript:void(0)"></a>

而 a 标签的 href 属性一定不能写错，

而经过我的实验 href 的属性值取 “#” 或者设置成 “javascript:void(0)” 第二个一定不能写错，否则跳转不成功。

href="javascript:void(0)"
href="#"

而函数就很简单了

<script type="text/javascript">
	function 函数名() {
		location.href="XXXXXXX";
		//或者是window.location.href="XXXXXXX";
	}
</script>

对比一下，没有写错的地方一定能跳转成功

写了两个互相跳转的测试页面：

demo1

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>location.href跳转实例</title>
</head>
<script type="text/javascript">
	function baidu2() {
		window.location.href = "demo2.jsp";
	}
	
	function baidu() {
		//window 可以省略  所以这也写也是可以的
		location.href = "demo2.jsp";
	}
</script>
<body>
	<a onclick="baidu()" href="#" >跳转测试1(# + location.href 组合)</a><br>
	<a onclick="baidu2()" href="javascript:void(0)" >跳转测试2(javascript:void(0) + window.location.href 组合)</a>
	<hr>
	<h1>我是demo1</h1>
</body>
</html>

demo2

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>location.href跳转实例</title>
</head>
<script type="text/javascript">
	function baidu() {
		window.location.href = "demo1.jsp";
	}
	
	function baidu2() {
		//window 可以省略  所以这也写也是可以的
		location.href = "demo1.jsp";
	}
</script>
<body>
	<a onclick="baidu()" href="#" >跳转测试1(# + window.location.href 组合)</a><br>
	<a onclick="baidu2()" href="javascript:void(0)" >跳转测试2(javascript:void(0) + location.href 组合)</a>
	<hr>
	<h1>我是demo2</h1>
</body>
</html>

location.href页面不跳转解决方案,附加加两个小案例

猜你喜欢