我正在开发一个 js 插件,人们可以将其嵌入到他们的网站/wordpress 中。使用ajax加载js并修改DOM中的一些标签(使用特定类)。该插件修改这些标签以嵌入带有来自 API 的自定义图钉的谷歌地图。
我想使用 href 链接 API url 和插件。但是,使用此 href 意味着单击 map 会重定向到 api,这不是我想要的。我可以使用 e.preventDefault()
但它会禁用内部谷歌地图链接(图钉是指向该地点详细页面的链接,这些链接是从 API 加载的)。
所以我想要的是简单地禁用插件容器 href,而不禁用子链接。这是一个示例:
<a href="link-to-the-api" class="my-plugin-class disable-me">
<div class="google-map">
<a href="link-to-place1" class="dont-disable-me">place 1</a>
<a href="link-to-place2" class="dont-disable-me">place 2</a>
<a href="link-to-place3" class="dont-disable-me">place 3</a>
</div>
</a>
<script src="http://my-custom-map.com"></script>
编辑:我忘了提到我想使用和 href 来改进 API 的 SEO。
谢谢!
最佳答案
正如 DanFromGermany 所指出的,您不能嵌套 <a>
元素。
相反,为什么不使用 div
?由于您似乎正在通过 onclick
处理点击它, 你可以使用 div
正好。然后您可以检查 e.target || e.srcElement
查看点击是否实际上是在其中一个链接上。如果是,则允许事件通过。否则,使用 API 处理它。
最好使用 data-*
属性,例如 data-api="link-to-the-api"
,并访问该属性。
关于javascript - 在 <a> 标签中禁用 href,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19294597/