限制連接點擊後跳轉功能實現

今天作個測試,代碼以下:
javascript

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">


<script type="text/javascript">
	window.onload = function() {
		var link = document.getElementsByTagName("a");
		for (var i = 0; i < link.length; i++) {
			link[i].onclick = function() {
				alert("hello javascript");
				
			}
		}
	}
</script>
</head>

<body>
	<a href="javascript:void(0)">link1</a>
	<br />
	<a href="#" onclick="return false;">link2</a>
	<br />
	<a href="#">link3</a>
	<br />
</body>
</html>

發現只有link1在點擊彈窗後不跳轉,其餘兩個不管是否在<a>標籤里加「return false",結果都會跳轉到http://localhost:8080/項目名/# , 這時的解決方案是:在function()裏alert()後加上return false,以下:html

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">


<script type="text/javascript">
	window.onload = function() {
		var link = document.getElementsByTagName("a");
		for (var i = 0; i < link.length; i++) {
			link[i].onclick = function() {
				alert("hello javascript");
				return false;	
			}
		}
	}
</script>
</head>

<body>
	<a href="javascript:void(0)">link1</a>
	<br />
	<a href="#" onclick="return false;">link2</a>
	<br />
	<a href="#">link3</a>
	<br />
</body>
</html>

這樣<a>標籤裏即使沒有"return false"同樣不會跳轉。java

相關文章
相關標籤/搜索