Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何使用JS禁用特定类中的链接?

如何使用JS禁用特定类中的链接?
EN

Stack Overflow用户
提问于 2022-08-18 21:27:31
回答 2查看 55关注 0票数 -1

我需要一个脚本来禁用“父”中的所有链接。我的类使用Vanilla JS (没有jQuery):

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<div class="my-class">
    <div class="class-1">
        <div class="class-2">
            <div class="class-3">
                <a href="#">
                    <div class="class-4"></div>
                </a>
                <a href="#">
                    <div class="class-4"></div>
                </a>
                <a href="#">
                    <div class="class-4"></div>
                </a>
            </div>
        </div>
    </div>
</div>

UPD:,我需要不能点击的链接。"href“条目是否仍然存在并不重要。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2022-08-18 22:29:59

你可以检查这个条目的答案,我想它们会有帮助的:How do I disable a href link in JavaScript?

但是,基本上,你有两个选择:

  1. 避免具有"href“属性的值。

1.1。将属性全部删除:parentElement.querySelectorAll('a').forEach(link => link.removeAttribute("href"));

1.2。将值设置为"javascript:void(0)":parentElement.querySelectorAll('a').forEach(link => link.setAttribute("href", "javascript:void(0)"));

  1. 防止触发单击事件:

parentElement.querySelectorAll('a').forEach(link => link.style.pointerEvents = "none")

票数 2
EN

Stack Overflow用户

发布于 2022-08-18 21:41:26

可以删除href属性或其值。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
links = document.querySelectorAll('.my-class a');
Array.from(links).forEach(element => {
    element.setAttribute('href', '#');
});
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/73412185

复制
相关文章
js中如何判断数组中包含某个特定的值_js数组是否包含某个值
array.includes(searchElement[, fromIndex])
全栈程序员站长
2022/09/27
18.5K0
网页里如何使用js禁用F12事件
接上一篇,突然想起来,类似于网页里如何使用js禁用鼠标右击事件,还有禁用F12事件也可以禁用一下,总所周知,对于Web开发人员来说,常常要进行界面的调试。使用F12调试工具能够很方便地进行调试,查看html元素,查看响应事件,但是对于自己开发出来的网页,我时常不想被别人看到图片,视频,源码等相关信息,于是常添加这样的代码:
王小婷
2018/09/26
4.1K0
如何禁用WordPress自带的jQuery.js
  我们在做wordpress主题时一般会引入jQuery.min.js,比如1.12.4版本,这时想禁掉WordPress自带jQuery.js的加载(不禁掉的话可能会出现新添加的js代码无法正常运行),如何实现呢?随ytkah一起来看看吧
ytkah
2021/08/18
2.1K0
9.29【前端开发】超链接伪类:如何在svg元素上使用超链接伪类?
这个样式可能会被后声明的其他链接相关的伪类覆盖,这些伪类包括 (:link, :hover,和:active)。要适当地设置链接样式,请将:visited 规则放在:link 规则之后,但在:hover 和:active 规则之前。
LIYI
2020/10/09
1.9K0
9.29【前端开发】超链接伪类:如何在svg元素上使用超链接伪类?
C代码中如何使用链接脚本中定义的变量?
https://sourceware.org/ml/binutils/2007-07/msg00154.html
韦东山
2020/09/30
4.1K0
9.25【前端开发】超链接伪类:如何在svg元素上使用超链接伪类?
a:link 未单击访问时超链接样式 a:link{color:#9ef5f9;}
LIYI
2020/10/09
2.3K0
9.25【前端开发】超链接伪类:如何在svg元素上使用超链接伪类?
npm 中如何下载特定的组件版本
IMWeb前端团队
2018/01/08
4.3K0
npm 中如何下载特定的组件版本
ICCII中如何保持特定module的port
在进行后端设计时,为了使得最终的结果更加优化,也就是面积,功耗,性能更好,工具在优化时可能会把module的port改变。但是这样可能会带来一些问题。问题之一就是前端在进行仿真的时候,由于某些module port找不到了,很难找到需要监测的信号。
白山头
2020/09/15
2.6K0
npm 中如何下载特定的组件版本
为了更好的进行说明,我们选择了 lodash 来演示,因为它是被其他模块依赖最多的模块之一。本文是在 windows 7 64位系统中进行测试,npm 版本为 v3.8.1,其他的平台和 npm 版本在某些提示上可能会稍有不同。
IMWeb前端团队
2019/12/04
4.1K0
js获取url链接中的域名部分
因为一个正确的url必定是由http://或者是https://、domain、路径/参数组成,所以可以用split以/进行分割成数组,取第3部分就是域名了。
全栈程序员站长
2022/07/08
9.2K0
如何使用特定显卡跑pyTorch
如何使用特定显卡跑pyTorch。方法一:改变系统变量使得仅目标显卡可见:export CUDA_VISIBLE_DEVICES=0 #这里是要使用的GPU编号,正常的话是从0开始然后再运行pyTorch即可。方法二:使用torch.cuda接口:#在生成网络对象之前:torch.cuda.set_device(0)方法三:使用多pytorch的并行GPU接口:net = torch.nn.DataParallel(model, device_ids=[0])方法四:初始化模型时net = Net.cuda
狼啸风云
2020/02/13
2.9K0
如何使用Cloudera Manager禁用YARN的HA
前面Fayson写过《如何使用Cloudera Manager启用YARN的HA》。本篇文章主要讲述如何使用Cloudera Manager禁用YARN的HA。
Fayson
2018/03/29
1.1K0
如何使用Cloudera Manager禁用YARN的HA
JS 禁用移动流量球、禁用iframe嵌入
情况1: native 与h5 交互 使用WebViewJavascriptBridge,此时,在native 会在打开你的网页的时候,嵌入一个iframe,来跟你交互。具体交互,请移步:http://blog.csdn.net/qq_16559905/article/details/50623069
White feathe
2021/12/08
3.9K0
如何使用VBA统计字符串中某个特定字符
如果要统计某单元格中指定的某特定字符的数量,可以使用LEN/SUBSTITUTE函数组合的经典公式(假设字符串位于单元格B2):
fanjy
2022/06/04
5.5K0
如何使用VBA统计字符串中某个特定字符
如何使用Columbo识别受攻击数据库中的特定模式
Columbo是一款计算机信息取证与安全分析工具,可以帮助广大研究人员识别受攻击数据库中的特定模式。该工具可以将数据拆分成很小的数据区块,并使用模式识别和机器学习模型来识别攻击者的入侵行为以及在受感染Windows平台中的感染位置,然后给出建议表格。需要注意的是,当前版本的Columbo仅支持在Windows操作系统平台上执行任务。
FB客服
2021/04/29
3.5K0
javascript禁用链接跳转等默认动作
比如,有一个链接,你要在这个链接跳转前执行一些其他操作,显然,我们能想到给它添加一个单击(onclick)事件,然后执行其他的一些操作,但是你会发现,你所定义的单击事件里的操作并没有执行,而直接进行了页面跳转。那这样,我们就应该先要禁用它的链接,然后执行自定义的操作,再进行跳转或执行其他操作,那么,我们该如何禁用链接,禁用它的默认动作呢?这个问题,我们在开发中很少遇到,但遇到了也并不难处理。
Petrochor
2022/06/07
1.3K0
JS中Class类的详解
    在ES6中,class (类)作为对象的模板被引入,可以通过 class 关键字定义类。它可以被看作一个语法糖,让对象原型的写法更加清晰、更像面向对象编程的语法。     类实际上是个“特殊的函数”,就像你能够定义的函数表达式和函数声明一样,类语法有两个组成部分:类表达式和类声明。
全栈程序员站长
2022/09/05
4.4K0
Java 类和对象,如何定义Java中的类,如何使用Java中的对象,变量
6.类与对象方法,属性的联系和区别:类是一个抽象的概念,仅仅是模板,比如:“手机”对象是一个你能够看得到,摸得着的具体实体
用户7886150
2021/01/31
6.9K0
golang中如何使用http长链接(client端)
RESTFUL请求大部分都可以用短连接,即三次握手建立链接,交换数据完成后,释放掉的链接,短链接不会长时间占用端口号,实际项目中还会用到另一种,长链接,比如客户端发送RESTFUL请求,需要监测某一资源变化情况,服务端提供watch机制,在资源有变化时通知client端。 那么client端,相对于短链接,长链接应该怎么写呢? 和短链接基本一样,只需要循环读取server端返回的response即可。 package main import ( "fmt" "io"
李海彬
2018/03/27
2K0
点击加载更多

相似问题

如何使用js/css禁用特定类的</td>选择?

52

JS滚动链接-使用linkify -如何针对特定的类?

12

需要禁用CMS生成的特定类中的链接

21

angular.js链接行为-禁用特定URL的深度链接

70

如何使用javascript禁用页面上的所有链接,只有具有特定类的链接除外

15
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文