锚链接仅适用于“在新选项卡中打开链接”命令

Question

我遇到了这个有趣的情况：

<ul>
    @foreach (var item in Model)
    {
      <li>
        <a href="@Url.Action("Details", "Product", new { id = item.Id })" >@item.Name</a>
      </li>
    }
</ul>

当我单击链接时，没有任何反应，产品详细信息页面未打开。但我做了“在新选项卡中打开链接”，然后它打开了。其原因可能是什么？

Answer 1

您有一些 JavaScript 代码阻止执行锚标记的默认操作。您可以检查 FireBug 或 Chrome DevTools 中的

Network

选项卡，看看单击链接时是否正在发出某些 AJAX 请求。您可以尝试排除 javascript 文件，直到找到正在执行此操作的文件。

Answer 2

也许您使用 JavaScript 阻止了标签的重定向事件。

例如：

$(document).on('click', 'a.thatTag', function (e) {
   // ...
   e.preventDefault();
});

.preventDefault()

防止重定向。

Answer 3

Darren 给出的正确答案是，肯定是某些 javascript 代码发送了 AJAX 请求（post 或 get），导致链接无法按您的预期运行。

但是，如果您使用了外部资源，则可能很难更正

min

文件中的错误。

我建议使用内联的 jquery onclick 事件来规避 AJAX 调用

<a href="http://foo.bar/" onclick="window.open('https://www.foo.bar/culrsteam')">Foo</a>

您还可以像使用

window.open('https://www.foo.bar/culrsteam', '_blank')

 一样使用 

target='_blank'

Answer 4

试试这个代码...

<a href="http://google.com/" onclick="location.replace('http://google.com/'),'_top'">Google</a>

Answer 5

我在父元素上设置了

e.preventDefault()

。

Answer 6

如果地址的 href 属性中没有传输协议，则可能会发生这种情况。一个示例是将 localhost 链接为

<a href="localhost"></div>

而不是

<a href="http://localhost"></div>

。如果这样做，您将看到 Google Chrome 将给出取消状态，并且在 Safari 中将出现一个对话框，询问应在哪个应用程序中打开链接，因为传输协议未知。我在PHP中设置

$_SERVER['HTTP_HOST']

的链接时遇到了这个问题。

关键点是，请确保将传输协议留在链接前面，无论是

http://

、

https://

、

ftp://

或其他任何协议。

Answer 7

我知道这是一个老问题，但刚刚遇到了类似的问题，听起来问题可能是您的请求被浏览器阻止了。如果您当前处于安全 (https) 环境中尝试链接到不安全 (http) 资源，则可能会发生这种情况。

不清楚您的 href 是什么，但如果您当前的环境是安全的，请确保 href 是 https（或//）。

Answer 8

我在使用 JS 设置链接的

href

属性后，在 ReactJS 中遇到了这个问题。我使用

useState

钩子解决了这个问题，链接应该是什么。

Answer 9

我有

data-bs-dismiss="modal"

，它关闭了我的模式，但阻止了重定向

Answer 10

对于我来说，它是页面文件的文件名。当我将pages/About.tsx重命名为pages/about.tsx时，它起作用了。