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调用中检索到的数据，但是如何在新选项卡中加载数据。我一直在寻找互联网，到目前为止我还没有找到解决方案。

Answer 1

不，至少使用你的方法做到这一点几乎是不可能的。如果您想使用浏览器本机提供的新标签功能，则不能将div与附加的Javascript处理程序一起用于链接。

你可以做什么：使用window.open作为目标使用_blank，但是你会遇到弹出窗口阻止程序的问题，这可能不是你想要的。

您还可以使用<a class="link" href="my-ajax-view/?some=parameters">press me</a>并编写一个显示您要查找的内容的页面（对我来说似乎是最好的解决方案，因为那时您还会为拥有Javascript的5％用户提供功能关掉）。您仍然可以通过单击该链接在JQuery上加载一些奇特的AJAX，但如果有人在新选项卡中打开链接，您将重定向到收集信息的页面。您的新点击处理程序将如下所示：

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

Answer 2

这违反了AJAX的概念，它打算通过发送单个数据的请求来摆脱each user action required that the page be re-loaded from the server，这将导致当前页面更新。请求数据创建一个在此概念之外的中断的新标签，这要求您发出第二个请求以实际显示标签。

选择：

使用AJAX，...
或者根本不做任何AJAX，只需打开一个请求数据的新标签。

不要混用这两者，因为它根本没有意义。

Answer 3

您可以随时使用您的php代码动态创建一个html页面，并将地址返回给它，并在javascript上的window.open命令中提到target =“_ blank”它。

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

Answer 4

我正在努力解决同样的问题，我找到了非常简单的解决方案。它只是基本上用这样简单的条件检查AJAX代码：

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

这样，只有当你不点击鼠标中键时才会调用AJAX，如果这样做仍然像普通链接一样，那么它会在新标签页面中打开页面。

在新标签页中打开ajax链接

4 个答案: