enlaces ajax Abrir en una nueva pestaña

Question

Estoy construyendo un sitio orientado Ajax y todos mis enlaces funcionan así:

<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> 

de cómo realizar estos enlaces se abren en una nueva pestaña (en el botón central o en "abrir enlace en la nueva pestaña "al hacer clic derecho").

Sé que el navegador acaba de abrir la página original (url) sin los datos recuperados de la llamada Ajax, pero ¿cómo puedo hacer que cargue los datos en la nueva pestaña? He estado buscando en Internet y hasta ahora no he encontrado una solución.

Answer 1

No, al menos utilizando su enfoque haciendo eso es casi imposible. Si desea utilizar la nueva funcionalidad de pestaña proporcionada de forma nativa por el navegador, no puede usar div s con manejadores de Javascript conectados a ellos para sus enlaces.

Lo que puede hacer: use window.open con _blank como destino, pero se encontrará con problemas con los bloqueadores de ventanas emergentes, y eso probablemente no sea lo que desea.

También puede usar <a class="link" href="my-ajax-view/?some=parameters">press me</a> y escribir una página que muestre el contenido que está buscando (lo que parece ser la mejor solución para mí, porque también proporcionaría funcionalidad para el 5% de los usuarios que tienen Javascript desactivado) . Todavía puedes hacer algunas extravagantes cargas AJAX con JQuery al hacer clic en ese enlace, pero si alguien abre el enlace en una nueva pestaña, redirige a una página que recopila la información. Su nuevo controlador de clic entonces el siguiente aspecto:

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

Answer 2

siempre se puede crear dinámicamente una página HTML con el código php y devolver la dirección a ella y como se mencionó target = "_ blank" en un comando window.open de javascript.

De forma alternativa, ¿sería útil usar jQuery UI para crear una nueva pestaña con los datos del resultado?

Answer 3

Esto va en contra del concepto de AJAX, que pretende deshacerse de ese each user action required that the page be re-loaded from the server mediante el envío de solicitudes de datos individuales, lo que provocaría la actualización de la página actual. Solicitar datos para crear una nueva pestaña con saltos fuera de este concepto, , esto requiere que realice una segunda solicitud para obtener realmente la pestaña que se muestra.

Cualquiera de elegir por:

1. Los datos que se muestran en la pestaña actual usando AJAX, ...

2. o DO No Ajax en absoluto y sólo abrir una nueva pestaña, que las solicitudes los datos.

No mezcle estos dos porque simplemente no tiene ningún sentido.

Answer 4

Estaba luchando con el mismo problema y encontré una solución muy simple. Es, básicamente, sólo comprobar el código AJAX con la condición simple como esto:

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

De esta manera usted está llamando AJAX sólo cuando no hace clic en el botón central del ratón, si lo haces sigue comportándose como enlace normal, por lo que abre la página en una nueva pestaña.