html禁止a标签拖动,关于禁用html中a标签的思考

绝地灬酷狼 2022-10-09 05:54 417阅读 0赞

事实上这个问题在初次学习html中select标签时就已经冒出来了，时至今日，依旧没有找到使用纯css禁用a标签的办法——同事、同学、老师我都问过了，他们都千篇一律借助了JavaScript，难道真的必需要借助JavaScript吗？

1、纯css实现html中a标签的禁用：

怎样禁用a标签

body\{

font:12px/1.5 \\5B8B\\4F53, Georgia, Times New Roman, serif, arial;

\}

a\{

text-decoration:none;

outline:0 none;

\}

.disableCss\{

pointer-events:none;

color:\#afafaf;

cursor:default

\}

百度

点击

上面尽管使用纯css实现了对a标签的禁用，只是因为opera、ie浏览器不支持pointer-events样式，所以上面代码在这两类浏览器中起不到禁用a标签的作用。

2、借助Jquery和css实现html中a标签的禁用：

02 ——借助Jquery和css实现html中a标签的禁用

$(function() \{

$('.disableCss').removeAttr('href');//去掉a标签中的href属性

$('.disableCss').removeAttr('onclick');//去掉a标签中的onclick事件

\});

body \{

font: 12px/1.5 \\5B8B\\4F53, Georgia, Times New Roman, serif, arial;

\}

a \{

text-decoration: none;

outline: 0 none;

\}

.disableCss \{

color: \#afafaf;

cursor: default

\}

[百度][Link 1]

点击

这样的方式能够兼容全部浏览器，但是混用了JavaScript，这一点恐怕是致命的缺憾！！！

3、借助Jquery实现html中a标签的禁用：

03 ——借助Jquery实现html中a标签的禁用

$(function() \{

$('.disableCss').removeAttr('href');//去掉a标签中的href属性

$('.disableCss').removeAttr('onclick');//去掉a标签中的onclick事件

$(".disableCss").css("font","12px/1.5 \\\\5B8B\\\\4F53, Georgia, Times New Roman, serif, arial");

$(".disableCss").css("text-decoration","none");

$(".disableCss").css("color","\#afafaf");

$(".disableCss").css("outline","0 none");

$(".disableCss").css("cursor","default");

\});

[百度][Link 1]

点击

上面使用了纯Jquery实现了禁用html中a标签的功能。

[Link 1]: http://www.baidu.com/

发表评论取消回复

表情：

评论列表（有 0 条评论，417人围观）

还没有评论，来说两句吧...

相关阅读

相关深入解析HTML的＜a＞标签

Markdown文件支持HTML标签，今天在编辑Markdown文档时，我希望嵌入一个带有图片的链接，因此需要使用HTML的 `<a>` 标签。在此过程中，我深入了解了 `<a

清疚/ 2024年02月05日 14:12/ 0 赞/ 34 阅读

相关 jquery禁用a标签方法

jquery禁用a标签方法1 $(document).ready(function () { $("a").each(function ()

朱雀/ 2023年01月01日 11:56/ 0 赞/ 208 阅读

相关在HTML中，点击＜a＞标签禁止向上滑动

在HTML中，点击标签禁止向上滑动你好！这是你第一次使用 Markdown编辑器所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，

╰+哭是因爲堅強的太久メ/ 2022年12月05日 13:56/ 0 赞/ 289 阅读

相关 html禁止a标签拖动,关于禁用html中a标签的思考

事实上这个问题在初次学习html中select标签时就已经冒出来了，时至今日，依旧没有找到使用纯css禁用a标签的办法——同事、同学、老师我都问过了，他们都千篇一律借助了Jav

绝地灬酷狼/ 2022年10月09日 05:54/ 0 赞/ 418 阅读

相关 html a标签的使用

文章目录 1.本人使用实例 2.参考链接 1.本人使用实例 <span class="list verifyProduct"><a href=

比眉伴天荒/ 2022年09月10日 07:18/ 0 赞/ 235 阅读

相关 HTML中a标签的几大作用

在学习行级标签的时候总结有三大最为重要的行级标签，分别为：a标签；span标签；img标签。现在主要总结一下a标签的几大应用场景。一：外部页面链接外部页面链接需要一

青旅半醒/ 2022年05月18日 00:04/ 0 赞/ 227 阅读

相关 html常用标签详解3-a标签

a标签 1、a标签的属性　　a标签属于行内元素标签，双标签<a></a> 　　href:a标签的跳转地址　　target:打开方式（\_self自身；\_blank

阳光穿透心脏的1/2处/ 2022年01月07日 00:51/ 0 赞/ 359 阅读

相关 (前端)html与css，html 6、_a标签

a标签: anchor，锚的意思，超级链接，可跳转到相应的网站。 a标签是一个双标签。 a的属性 ![ContractedBlock.gif][] ![Expa

我不是女神ヾ/ 2021年11月23日 09:58/ 0 赞/ 369 阅读

相关 HTML---a标签详解

前言 <a>标签定义超链接，用于从一张页面链接到另一张页面。 <a>元素最重要的属性是 href 属性，它指示链接的目标。指向 w3school 的超链接：

落日映苍穹つ/ 2021年09月14日 12:50/ 0 赞/ 470 阅读

相关 HTML <a> 标签

HTML `<a>` 标签超链接是网页的核心内容之一。通过超链接可以实现站内页面或者站际页面之间的跳转。没有超链接的网站的可用性必然具有很大的局限性。

小灰灰/ 2020年05月16日 18:44/ 0 赞/ 828 阅读