在新标签页中打开ajax链接

Question

我正在构建一个以ajax为导向的网站，我的所有链接都是这样工作的：

<div class="link">press me </div>

<div id="contents" ></div>
<script>
    $('div[class="link"]').click(function() {
        $.ajax({                                      
            url: 'contents/get_products.php',
            type: "GET",        
            data: 
            dataType: 'json',               
            success: 
                function(data){ 
                  $.each(data, function(i){
                      $('#contents').append('<div class="cat_list_item">something</div>'); 
                  });
            }
        });
    });
</script>

如何使这些链接在新标签页中打开（在中键点击或右键“在新标签页中打开链接”时）。

我知道浏览器只会打开原始页面（url），而不会检索从Ajax调用中检索到的数据，但是我如何让它在新标签页中加载数据。 我已经在互联网上寻找了一段时间，但到目前为止我还没有找到解决方案。

- user1239634

Answer 1

不，至少使用您的方法几乎不可能做到这一点。如果您想使用浏览器本身提供的新标签功能，则不能使用带有附加到其上的Javascript处理程序的

来作为链接。

您可以这样做：使用window.open并将_blank用作目标，但是您将遇到弹出窗口拦截程序的问题，这可能不是您想要的。

您还可以使用press me并编写一个显示您正在寻找的内容的页面（对我来说似乎是最好的解决方案，因为那么您也将为关闭Javascript的5%用户提供功能）。您仍然可以在单击该链接时使用JQuery进行一些花哨的AJAX加载，但如果有人在新标签中打开该链接，则会重定向到收集信息的页面。然后，您的新点击处理程序将如下所示：

$('a.link').click(function(event) {
    event.preventDefault();
    // Your ajax request here
}

- nikolas

Answer 2

这违反了 AJAX 的概念，因为它的目标是通过发送单独的数据请求来更新当前页面，这样就可以摆脱每个用户操作都需要从服务器重新加载页面的限制。请求数据来创建一个新选项卡会打破这一概念，这需要你发送第二个请求来实际显示选项卡。

要么选择：

1. 使用 AJAX 在当前选项卡中显示数据...

2. 要么完全不使用 AJAX，只需打开一个请求数据的新选项卡。

不要混淆这两种选择，因为这根本没有任何意义。

- Tamara Wijsman

Answer 3

我曾经也遇到过同样的问题，但是我找到了一个非常简单的解决方案。只需要使用一个简单的条件来检查AJAX代码就可以了：

if (event.which !== 2) {
  // ajax code
}

这样做可以使得只有在不点击中键时才调用 AJAX，如果点击了中键，它仍然会像普通链接一样行为，因此会在新标签页中打开页面。

- Lukáš Jelič

Answer 4

你可以使用 PHP 动态生成一个 HTML 页面，并返回地址。然后，在 JavaScript 的 window.open 命令中，用 target="_blank" 打开该页面。

另一种方法是，使用 jQuery UI 创建一个新的选项卡来显示结果数据是否能达到目的？

- francisco.preller