JavaScript笔记之用链接对用户进行重定向

最新推荐文章于 2023-12-24 23:50:29 发布

xiaoliangmei

最新推荐文章于 2023-12-24 23:50:29 发布

阅读量1.6k

点赞数 2

分类专栏： Java Web 文章标签： javascript html redirect function features 浏览器

本文链接：https://blog.csdn.net/xiaoliangmeiny/article/details/7365549

版权

Java Web 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

本文介绍了一种根据用户是否启用JavaScript功能进行页面重定向的方法。通过两个HTML页面和一个JavaScript文件实现，用户点击链接后，若启用了JavaScript，则会被重定向到包含丰富JavaScript功能的页面；反之，则引导至提示页面。

摘要由CSDN通过智能技术生成

可以根据用户是否打开了JavaScript功能，无缝地对用户进行重定向(redirection)，也就是将用户转到另一个页面。这个示例演示如何将重定向功能嵌入链接中，下面将使用两个HTML页面和一个JavaScript文件。

第一个HTML页面向用户显示连接：

test.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>	
<title>Welcome to our site</title>
	<script type="text/javascript" src="script01.js">
</script>
</head>
<body bgcolor="#FFFFFF">
	<h2 align="center">
	<a href="script01.html" id="redirect">Welcome to our site... c'mon in!</a>
	</h2>
</body>
</html>

第二个HTML页面是在用户启用了JavaScript功能情况下用户被重定向到得HTML页面。

jswelcome.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>Our site</title>
</head>
<body bgcolor="#FFFFFF">
	<h1>Welcome to our web site, which features lots of cutting-edge JavaScript</h1>
</body>
</html>

script01.js

window.onload = initAll;

function initAll() {
	document.getElementById("redirect").onclick = initRedirect;
}

function initRedirect() {
	window.location = "jswelcome.html";
	return false;
}

script01.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>My JavaScript page</title>
</head>
<body bgcolor="#FFFFFF">
<noscript>
	<h2>This page requires JavaScript.</h2>
</noscript>
</body>
</html>

当用户打开"test.html"时，根据他们是否打开了javascript功能，将被带到script01.html或jswelcome.html两个页面之一。

js文件中的

function initRedirect() {
	window.location = "jswelcome.html";
	return false;
}

如果调用这个函数，它就将window.location（即浏览器中显示的页面）设置为一个新的页面。return false表示停止对用户点击的处理，这样就不会加载href页面中指定的页面，这种方式最酷的特色是，完成了重定向而用户根本不会意识到页面发生了重定向。（源《JavaScript基础教程》）

xiaoliangmei

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录