JS之怎么阻止a标签的跳转

最新推荐文章于 2024-02-29 11:15:15 发布

微微笑再加油

最新推荐文章于 2024-02-29 11:15:15 发布

阅读量1.9k

点赞数 1

分类专栏： JavaScript

本文链接：https://blog.csdn.net/chd_sun/article/details/103042246

版权

JavaScript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

基本上每个项目都会有多多少少的权限问题，通过权限来对用户赋予不同的功能，其中就有通过权限来实现该用户是否能通过a标签跳转的问题，例子如下

点击百度链接会跳到百度网站，当用户没有权限的时候怎么能阻止a标签跳转呢？
首先想到的是加上disabled这个属性，验证下是否能阻止其跳转
在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<link rel="stylesheet" type="text/css" href="css/change.css"/>
	<body>
		<a href="https://www.baidu.com"  disabled="true">百度链接</a>
	</body>
	
</html>

显然是不行的，还是跳转到了百度网页
在这里插入图片描述
这里就需要一个css的属性

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<a class="c" href="https://www.baidu.com"  disabled="true">百度链接</a>
	</body>
	
	<style type="text/css">
		.c{
		//这个类选择器户阻止a标签的跳转
			pointer-events: none;
		}
	</style>
</html>

在这里插入图片描述

微微笑再加油

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
JS之怎么阻止a标签的跳转

基本上每个项目都会有多多少少的权限问题，通过权限来对用户赋予不同的功能，其中就有通过权限来实现该用户是否能通过a标签跳转的问题，例子如下点击百度链接会跳到百度网站，当用户没有权限的时候怎么能阻止a标签跳转呢？首先想到的是加上disabled这个属性，验证下是否能阻止其跳转<!DOCTYPE html><html> <head> <meta ...
复制链接

扫一扫