Question

我知道大多数链接应由最终用户决定如何打开，但我们不能否认有时候你几乎“必须”强行进入新窗口（例如维护数据）在当前页面上的表格中。）

我想知道的是在新浏览器窗口中打开链接的“最佳”方式的共识是什么。

我知道<a href="url" target="_blank">已经出局了。我也知道<a href="#" onclick="window.open(url);">因各种原因而不理想。我还尝试用<span onclick="window.open(url);">之类的东西完全替换锚点，然后将SPAN设置为看起来像链接。

我倾向于使用的一个解决方案是<a href="url" rel="external">并使用JavaScript将所有目标设置为标记为“外部”的锚点上的“_blank”。

还有其他想法吗？什么更好？我正在寻找最符合XHTML标准且最简单的方法。

更新：我说target =“_ blank”是否定的，因为我已经在several places中读到目标属性将逐步退出XHTML。

Answer 1

我正在使用你提出的最后一种方法。我添加rel =“external”或类似的东西然后使用jQuery迭代所有链接并为它们分配一个点击处理程序：

$(document).ready(function() {
  $('a[rel*=external]').click(function(){
    window.open($(this).attr('href'));
    return false; 
  });
});

我发现这是最好的方法，因为：

语义非常明确：您有一个指向外部资源的链接
符合标准
它会优雅地降级（你有一个非常简单的常规href属性链接）
它仍然允许用户中间点击链接，如果他们愿意，可以在新标签中打开

Answer 2

为什么target="_blank"是个坏主意？

它应该完全符合您的要求。

编辑:(见评论）点了，但我确实认为使用javascript做这样的任务会导致让一些人感到非常沮丧（那些中间点击在习惯上打开一个新窗口的人，以及那些使用NoScript扩展名）

Answer 3

请不要强制在新窗口中打开链接。

反对它的原因：

它侵犯了最不惊讶的规则。
后退按钮不起作用，用户不太可能知道原因。
标签式浏览器会发生什么？新标签页或新窗口？无论哪个发生，如果你混合标签和窗口，它是你想要的吗？

我总是听到支持打开新窗口的原因是用户不会离开该网站。但可以肯定的是，我永远不会回到一个让我烦恼的网站。如果该网站取消了我的控制权，那将是一个很大的烦恼。

一种方法可能是，您提供两个链接，一个是正常的，另一个是在新窗口中打开它。在普通链接后添加带有小符号的第二个。这样，您网站的用户就可以控制他们想要点击的链接。

Answer 4

这是我为jQuery编写的插件

 (function($){  
  $.fn.newWindow = function(options) {       
    var defaults = {
        titleText: 'Link opens in a new window'     
    };

     options = $.extend(defaults, options);

     return this.each(function() {  
       var obj = $(this);

       if (options.titleText) {        
           if (obj.attr('title')) {
                     var newTitle = obj.attr('title') + ' (' 
                                                + options.titleText + ')';
           } else {
                    var newTitle = options.titleText;
           };              
           obj.attr('title', newTitle);            
       };          

       obj.click(function(event) {
          event.preventDefault();  
          var newBlankWindow = window.open(obj.attr('href'), '_blank');
          newBlankWindow.focus();
        });     
       });    
  };  
 })(jQuery);

使用示例

$('a[rel=external]').newWindow();

您还可以通过传递一些选项来更改或删除标题文本

更改标题文字的示例：

$('a[rel=external]').newWindow( { titleText: 'This is a new window link!' } );

完全删除它的示例

$('a[rel=external]').newWindow( { titleText: '' } );

Answer 5

也许我误解了一些东西，但为什么你不想使用target =“_ blank”？这就是我这样做的方式。如果您正在寻找最兼容的，那么任何类型的JavaScript都会被淘汰，因为您无法确定客户端是否已启用JS。

Answer 6

<a href="http://some.website.com/" onclick="return !window.open( this.href );">link text</a>

详细信息在我的answer to another question。

中进行了描述

Answer 7

<a href="http://www.google.com" onclick="window.open(this.href); return false">

如果用户已禁用JS，这仍将打开链接（尽管在同一窗口中）。否则它的作用与target = blank完全相同，而且它很容易使用，因为您只需要将onclick函数（可能通过使用JQuery）附加到所有普通标记。

Answer 8

如果您使用任何严格的doctype或即将推出的真正的xhtml风格，那么目标是不允许的......

使用transitional，无论是HTML4.01还是XHTML1，你都可以使用Damirs解决方案，虽然它无法实现window.open（）中必需的windowName属性：

简单的html：

<a href="..." target="_blank" onclick="window.open(this.href, 'newWin'); return false;">link</a>

但是如果您使用严格的doctypes之一，那么打开链接的唯一方法就是使用没有target-attribute的解决方案......

- 顺便说一句，非js浏览器的数量经常被误算，查找计数器数字指的是非常不同的数字，我想知道有多少非js浏览器是爬虫等等！ - ）

Answer 9

如果我在表单页面上并点击moreinfo.html链接（例如）导致我丢失数据，除非我在新的标签/窗口中打开它，请告诉我。

你可以欺骗我打开一个带有window.open（）或target =“_ blank”的新标签/窗口，但我可能会禁用目标和弹出窗口。如果您需要使用JS，目标和弹出窗口来欺骗我打开一个新的窗口/标签，请在开始使用表单之前告诉我。

或者，将表单请求链接到另一个页面，以便在访问者提交时，保存当前表单数据，以便他们可以从上次继续，如果可能的话。

Answer 10

我用这个......

$(function() {
  $("a:not([href^='"+window.location.hostname+"'])").click(function(){
    window.open(this.href);
    return false;
  }).attr("title", "Opens in a new window");
});

打开新浏览器窗口的最佳方法是什么？

10 个答案: