Question

window.location.hash

当使用链接进行javascript操作时，我通常会这样做：

<a href="#">Link Text</a>

这样，当有人在页面加载之前点击链接时，没有任何可怕的事情发生。

Html基本标记

在我当前的项目中，我使用相同的构造，但使用基本标记：

<html>
<head>
    <base href="http://example.com/" />
</head>
<body>
    <a href="#">Link Text</a>
</body>
</html>

但是，如果页面网址为：

http://example.com/dir/page

点击该链接导航至

http://example.com/#

而不是

http://example.com/dir/page#

我该如何解决这个问题？

Answer 1

删除base代码或将href属性更改为完全限定。当您将base与a元素混合时，您所观察到的是预期的行为。

Answer 2

如果您倾向于使用标签，则另一种解决方案是不使用＃作为href目标（当您没有指定一个时，它会导致跳转到我觉得不合适的页面顶部）。你能做的是：

<a href="javascript:">Some Link that Goes nowhere</a>

实际上，除非你做的事情要求成为一个标签，否则跨度将是你最好的选择：

CSS：

.generic_link {
  text-decoration:underline;
}
.generic_link:hover {
  text-decoration:none;
}

HTML：

<span class="generic_link">Something that really isn't a link</span>

Answer 3

如果没有适合非JavaScript用户的网址，请不要使用<a>。 <a>标记用于指向其他网页的链接。

任何可见的HTML元素都可以有onclick，并且不会出现您描述的这个问题。

Answer 4

在false事件上返回onclick以停用链接：

<a href="#" onclick="doSomething(); return false">Link Text</a>

（这只是你如何内联的一个例子。但是尽量避免使用内联声明并使用progressive enhancements的技术。）

Answer 5

<html>
<head>
    <base href="http://example.com/" />
</head>
<body>
    <a href="./dir/page#">Link Text</a>
</body>
</html>

Answer 6

我过去也遇到过同样的问题我有一个我想要空的链接，链接到当前页面如果没有base html element，则只有a元素href="#"。

我没有使用base html元素的示例

<li>
    <a href="#"><div>The text of my Link</div></a>
</li>

与我找到的解决方案相同的例子，

<li style="cursor: pointer !important;">
    <a href="#" style="pointer-events: none;"><div>The text of my Link</div></a>
</li>

使用第一个css规则cursor: pointer !important;我确保此链接具有正确的（对于我的情况）指针图标。
根据第二条规则pointer-events: none;，我确保此链接无法点击您可以在this link之后找到有关此规则的更多信息。

Answer 7

您只需从href代码中删除<a>属性即可。

<a href="#"> => <a>