限制连接点击后跳转功能实现

时间 2019-11-20

标签限制连接点击功能实现繁體版

原文原文链接

今天作个测试，代码以下：
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