javascript - 当 URL 不完整时，在新选项卡中打开 URL 会生成 404

Question

我想在用户单击链接时打开一个新选项卡。该链接是用户生成的，当用户输入 www.google.com 等网址时，该选项卡无法按预期工作。这是jsFiddle显示问题，这是代码:

<a href="javascript: var a = window.open('www.google.com')">open new tab</a>

我该如何解决这个问题？告诉用户输入格式正确的 URL 不是一个选项。

Answer 1

不要忘记协议(protocol)

window.open() 函数期望在请求 URL 时存在适当的协议(protocol)(即 http://、ftp://、https:// 等)，因此您需要确保包含此内容才能正常工作:

window.open('http://www.google.com');

手动添加协议(protocol)

如果您出于某种原因需要显式省略协议(protocol)，您可以考虑编写一个函数来为您打开窗口:

function openWindowAndPrependProtocol(url){
    if(/^https?:\/\//i.test(url)){
        // If it doesn't start with http:// or https://, then append it
        return window.open('http://' + url);
    }
}

这会更改您要使用的代码:

var a = openWindowAndPrependProtocol('www.google.com');

注意

根据 Mozilla 的说法，他们 generally don't recommend using links in this manner to open new windows via window.open() if at all possible ，因为它可能会带来一些可用性问题。他们的best practices建议使用类似于第二种方法的外部函数来处理打开窗口。