禁用<a> tag</a>中的href

时间:2013-10-10 11:30:25

标签: javascript html seo

我正在开发一个人们可以嵌入他们的网站/ wordpress的js插件。使用ajax加载js并修改DOM中的一些标记(使用特定的类)。该插件会修改这些标记,以使用来自API的自定义引脚嵌入谷歌地图。

我想使用href链接API网址和插件。但是,使用此href意味着单击地图会重定向到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。

谢谢!

2 个答案:

答案 0 :(得分:2)

正如DanFromGermany所指出的,你不能嵌套<a>元素。

相反,为什么不使用div?由于您似乎是通过onclick处理点击,因此您可以使用div。然后,您可以检查e.target || e.srcElement以确定点击是否实际位于其中一个链接上。如果是,请允许事件通过。否则,使用API​​处理它。

您最好使用data-*属性,例如data-api="link-to-the-api",并访问该属性。

答案 1 :(得分:0)

您可以使用onclick="return false;"来阻止更改页面。

另外,您应该知道不允许在<a>内使用<a>标记。