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

What's the best way to open new browser window?

本文关键字：最佳 方法 是什么 窗口 浏览器      更新时间：2023-09-26

我知道大多数链接应该留给最终用户来决定如何打开，但我们不能否认有时您几乎"必须"强行进入新窗口（例如在当前页面上以表单维护数据）。

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

我知道<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"是一个不行的，因为我在几个地方读到目标属性将被逐步淘汰XHTML。

我正在使用您提出的最后一种方法。我添加了rel="external"或类似的东西，然后使用jQuery遍历所有链接并为其分配一个点击处理程序：

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

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

  • 语义上非常清楚：您有一个指向外部资源的链接
  • 符合标准
  • 它优雅地降级（您有一个非常简单的链接，带有常规href属性）
    • 它
  • 仍然允许用户中键单击链接并在新选项卡中打开它，如果他们愿意的话

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

它应该完全按照您的要求行事。

编辑：（见评论）采取的观点，但我确实认为使用javascript来完成这样的任务可能会导致一些人非常沮丧（那些习惯于中键在新窗口中打开的人，以及那些使用NoScript扩展的人）

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

反对的理由：

  • 它违反了最不惊讶的规则。
  • 后退按钮不起作用，用户可能不知道原因。
  • 选项卡式浏览器中会发生什么？新标签还是新窗口？无论发生什么，如果您混合使用选项卡和窗口，这是您想要的吗？

我总是听到赞成打开新窗口的原因是用户不会离开网站。但可以肯定的是，我永远不会回到一个让我烦恼的网站。如果网站从我手中夺走控制权，那将是一个很大的烦恼。

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

这是我

为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: '' } );

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

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

细节在我对另一个问题的回答中有所描述。

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

如果用户禁用了JS，这仍将打开链接（尽管在同一窗口中）。否则，它的工作方式与 target=blank 完全相同，并且易于使用，因为您只需要将 onclick 函数（也许通过使用 JQuery）附加到所有普通标签。

如果您使用任何严格的文档类型或即将推出的真正 xhtml 风格，则不允许使用 target...

使用

过渡，无论是HTML4.01还是XHTML1，你都可以使用Damirs解决方案，尽管它无法实现window.open（）中必需的windowName-property：

在纯 html 中：

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

但是，如果您使用严格的文档类型之一，则打开链接的唯一方法是使用此解决方案而不使用目标属性...

-- 顺便说一下，非 js 浏览器的数量经常计算错误，查找计数器编号引用非常不同的数字，我想知道这些非 js 浏览器中有多少是爬虫之类的！

如果我在表单页面上并单击更多信息.html链接（例如）会导致我丢失数据，除非我在新的选项卡/窗口中打开它，请告诉我。

你可以欺骗我用window.open（）或target="_blank"打开一个新的标签/窗口，但我可能禁用了目标和弹出窗口。如果您需要 JS、目标和弹出窗口来诱骗我打开新窗口/选项卡，请在我开始使用表单之前告诉我。

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

我用这个...

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