Jquery 在“新建”选项卡中打开ajax链接

我正在构建一个面向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>

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

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

按我
$（'div[class=“link”]”）。单击（函数（）{
$.ajax（{
url:'contents/get_products.php'，
键入：“获取”，
数据：
数据类型：“json”，
成功：
函数（数据）{
$。每个（数据、功能（i）{
$（'#contents'）。追加（'something'）；
});
}
});
});

如何使这些链接在新选项卡中打开（中键单击或右键单击“在新选项卡中打开链接”）

我知道浏览器只是打开原始页面（url），而没有从Ajax调用中检索到的数据，但是如何让它在新选项卡中加载数据呢。

---

我一直在网上寻找，现在还没有找到解决办法

不，至少用你的方法这样做是不可能的。如果您想使用浏览器本机提供的新选项卡功能，则不能将带有Javascript处理程序的

div

s用于链接

您可以做什么：使用

窗口。以
\u blank
作为目标打开

，但弹出窗口阻止程序会出现问题，而这可能不是您想要的

您还可以使用

编写一个页面，显示您正在寻找的内容（对我来说这似乎是最好的解决方案，因为这样您还可以为关闭Javascript的5%用户提供功能）。您仍然可以在单击该链接时使用JQuery进行一些奇特的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>

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

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

---

您始终可以使用php代码动态创建html页面，并返回地址，如javascript中的window.open命令中所述，target=“_blank”将其返回

---

或者，使用jQuery UI创建一个包含结果数据的新选项卡是否可以完成这项工作？

这与AJAX的概念背道而驰，AJAX的目的是消除

每个用户操作都需要通过发送对单个数据的请求从服务器重新加载页面，这将导致当前页面更新。请求数据以创建一个新的选项卡，其中包含此概念之外的中断，这需要您发出第二个请求，以实际显示该选项卡

选择以下选项之一：

要使用AJAX在当前选项卡中显示的数据

或者根本不使用AJAX，只需打开一个请求数据的新选项卡

不要把这两个问题混为一谈，因为这根本没有意义。
我一直在为同一个问题苦苦挣扎，我找到了非常简单的解决方案。它基本上只是使用以下简单条件检查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>

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

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

这样，您只有在不单击鼠标中键的情况下才调用AJAX，如果单击鼠标中键，它的行为仍然像普通链接一样，因此它会在新选项卡中打开页面