与target ="_ blank"的链接无法在Chrome中的新标签页中打开

Ste*_*eve 22 html hyperlink

这个网站上,顶级手风琴导航包含一个名为"Foundation"的元素:( 截图).

此元素由HTML代码生成:

<a href="http://www.foracure.org.au" target="_blank" style="width: 105px;"></a>
Run Code Online (Sandbox Code Playgroud)

但是,在Chrome中,当您单击此元素时,新网站不会在新选项卡中打开.

你能告诉我为什么吗?谢谢.

Jac*_*ack 16

因为JavaScript正在处理click事件.单击时,将调用以下代码:

el.addEvent('click', function(e){
    if(obj.options.onOpen){
        new Event(e).stop();
        if(obj.options.open == i){
            obj.options.open = null;
            obj.options.onClose(this.href, i);
        }else{
            obj.options.open = i;
            obj.options.onOpen(this.href, i);
        }   
    }       
})
Run Code Online (Sandbox Code Playgroud)

onOpen手动更改location.

编辑:关于你的评论...如果你可以修改ImageMenu.js,你可以更新调用onClose传递a元素对象的脚本(this而不是this.href)

obj.options.onClose(this, i);
Run Code Online (Sandbox Code Playgroud)

然后更新ImageMenu实例,并进行以下onOpen更改:

window.addEvent('domready', function(){
    var myMenu = new ImageMenu($$('#imageMenu a'), {
        openWidth: 310,
        border: 2,
        onOpen: function(e, i) {
            if (e.target === '_blank') {
                window.open(e.href);    
            } else {
                location = e.href;
            }
        }
    });
});
Run Code Online (Sandbox Code Playgroud)

这将检查元素的target属性以查看它是否_blank,然后调用window.open(如果找到).

如果您不想修改ImageMenu.js,则另一个选项是修改链接以在onOpen处理程序中标识它们.说出类似的话:

<a href="http://www.foracure.org.au/#_b=1" target="_blank" style="width: 105px;"></a>
Run Code Online (Sandbox Code Playgroud)

然后,将您的onOpen呼叫更新为:

onOpen: function(e, i) {
    if (e.indexOf('_b=1') > -1) {
        window.open(e);   
    } else {
        location = e;
    }
}
Run Code Online (Sandbox Code Playgroud)

唯一的缺点是用户在悬停时看到哈希值.

最后,如果您计划在新窗口中打开的链接数量很少,您可以创建一个地图并对其进行检查.就像是:

var linksThatOpenInANewWindow = {
    'http://www.foracure.org.au': 1
};

onOpen: function(e, i) {
    if (linksThatOpenInANewWindow[e] === 1) {
        window.open(e);   
    } else {
        location = e
    }
}
Run Code Online (Sandbox Code Playgroud)

唯一的缺点是维护,取决于链接的数量....

其他人建议修改链接(使用#javascript:)并添加内联事件处理程序(onclick) - 我不建议这样做,因为它在JS被禁用/不支持时断开链接.

祝好运!


Anu*_*rag 13

Replace 

<a href="http://www.foracure.org.au" target="_blank"></a>    

with 

<a href="#" onclick='window.open("http://www.foracure.org.au");return false;'></a>
Run Code Online (Sandbox Code Playgroud)

在您的代码中,可以在Chrome和其他浏览器中使用.

谢谢Anurag

  • 这会奏效.但是正如杰克所提到的,如果不支持javascript,这将会中断.MDN建议永远不要使用它并给出几个原因.希望这会有所帮助:https://developer.mozilla.org/en-US/docs/Web/API/Window/open#Never_use_this_form_of_code_for_links_%3Ca_hrefjavascriptwindow.open(...)_...%3E (2认同)
  • 这不是一个好的替代品,因为这可能会阻碍这些链接的抓取 (2认同)

小智 6

由于某种原因它不起作用所以我们可以通过另一种方式做到这一点

只需删除该行并添加以下内容:-

<a onclick="window.open ('http://www.foracure.org.au', ''); return false" href="javascript:void(0);"></a>
Run Code Online (Sandbox Code Playgroud)

祝你好运。


Tor*_*sDB 5

向另一个人学习:

<a onclick="window.open(this.href,'_blank');return false;" href="http://www.foracure.org.au">Some Other Site</a>
Run Code Online (Sandbox Code Playgroud)

对于我,这说得通。


小智 1

您的目标属性语法是正确的,但浏览器不需要遵守它。他们可能会将其解释为在新选项卡而不是新窗口中打开目的地,或者他们可能完全忽略该属性。浏览器有针对此类问题的设置。此外,浏览器插件可能会阻止打开新窗口(通常旨在防止烦人的广告)。

\n\n

作为一名作者,你对此无能为力。您可能会考虑使用 JavaScript 打开一个新窗口,参见。对于 target="_blank" 的接受答案在 firefox 中不起作用?,但浏览器可能更不愿意让页面以这种方式打开新窗口,而不是通过 target。

\n\n

target="_blank" 在 Firefox 中不起作用?

\n