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

绝地灬酷狼 2022-10-09 05:54 530阅读 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

}

百度

点击

这样的方式能够兼容全部浏览器,但是混用了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”);

});

百度

点击

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

发表评论

表情:
评论列表 (有 0 条评论,530人围观)

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

相关阅读

    相关 深入解析HTMLa标签

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

    相关 HTMLa标签几大作用

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

    相关 HTML <a> 标签

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