如何禁用锚点指针事件，同时为锚点子级保留它们？-解网

问：

我有一个锚元素，里面有几个子元素。需求已更改，现在锚点上可能有也可能没有链接。更改它的最简单方法是禁用锚点的点击事件，并将其保留给子（它们具有一些依赖于指针事件的功能）。

当我申请锚点父级时，一切都很好 - 链接不起作用。当我随后应用于锚定子项时，该链接将再次变为活动状态。pointer-events: nonepointer-events: auto

生成的 html 是这样的：

<a href class='no-pointer-events'>
    <figure class='pointer-events-auto'></figure>
</a>

我该如何解决这个问题？

HTML CSS 指针事件

该元素用于创建超链接，并且应仅包含一个子元素。通常，此子元素是表示可单击链接文本的文本节点。出于 SEO 目的，在锚元素中必须有有意义和描述性的链接文本。这有助于搜索引擎了解链接的上下文和相关性，从而有可能改善页面的搜索引擎优化。a

0赞 A Haworth 7/19/2023

@sadeqshahmoradi 我从未听说过锚元素必须只有一个孩子。你有参考资料吗？

答：

1赞 Moseleyi 7/16/2023 #1

如果元素的某个子元素将指针事件显式设置为允许该子元素成为指针事件的目标，则当事件沿着父链传输时，任何针对该子元素的事件都将通过父元素，并根据需要触发父元素上的事件侦听器。

因此，如果使用指针事件设置任何子项，它将冒泡到父项。

-1赞 budgiebeaks 7/16/2023 #2

以下工作几乎按预期进行：

<a href={tab.url ? tab.url : "javascript:void(0)"} >

唯一的问题是它显示为链接，但其他方面工作正常，链接不可点击。'javascript:void(0)'

如何禁用锚点指针事件，同时为锚点子级保留它们？