2009-05-06 58 views
15

Tengo una página con una lista de enlaces y un div que sirve como marcador de posición para las páginas a las que conducen los enlaces. Cada vez que un usuario hace clic en un enlace, se crea un iframe en el div y su atributo src obtiene el valor del atributo href del enlace: simple y clara, como una especie de galería de páginas web externas. Lo que sí tengo un problema con es imprimir el contenido del iframe. Para ello i utilizar este código:Imprimir contenidos de un iframe creado dinámicamente desde la ventana principal

 
function PrintIframe() 
{ 
frames["name"].focus(); 
frames["name"].print(); 
} 

El problema parece ser que iframe se crea dinámicamente por jQuery - cuando inserto un iframe a la derecha en el código HTML, el navegador imprime la página externa bien. Pero con el mismo código inyectado por JavaScript, nada sucede. Intenté utilizar el evento JQ 1.3 'en vivo' en el enlace "Imprimir", sin éxito. ¿Hay una manera de superar esto?

Respuesta

26

Supongamos que esto es lo que su iframe parece :

<iframe id='print-iframe' name='print-frame-name'></iframe> 

ésta es la forma de hacerlo usando jQuery:

$("#print-iframe").get(0).contentWindow.print(); 

y esto es cómo lo hace u cantar JavaScript orígenes:

document.getElementById("print-iframe").contentWindow.print(); 
+4

+ 1 para 'contentWindow' –

0

Hmm doy get this right? ¿Solo necesita cambiar la fuente de dónde conduce el IFrame?

$("#iframe").attr("src", "http://www.example.com"); 
+0

no, el problema es que no puedo imprimir la página en el iframe - hay 2 opciones: 1) es posible la impresión como si fuera una parte de la página (con PrintArea plugin) - pero luego imprime solo una página y el contenido de la página iframed no está formateado en el papel como debería ser. 2) es posible imprimirlo como una página normal, pero SOLO si la etiqueta iframe no se inserta dinámicamente, a través de JS, sino que se presenta estáticamente en HTML. – certainlyakey

0

Quizás la restricción del mismo dominio impida la ejecución de JavaScript. La restricción del mismo dominio permite que JavaScript en el marco A (o la ventana principal) interactúe (como .print()) con el fotograma B si A y B son del mismo dominio. Verifique su consola de error de JavaScript. Si obtiene algo así como un error de excepción/permiso de seguridad, entonces es muy probable que se deba a la restricción del mismo dominio.

+0

No, no tengo tales errores en Firebug ... Y sí, las páginas son todas del mismo dominio. – certainlyakey

7

Intenté esto y pude replicar el problema. Lo que noté fue que, al llamar a la función de impresión, el iframe no se había completado cargado. Probé esto al verificar el valor de innerHTML cuando llamo a PrintIFrame(). Para superar esto, se puede utilizar setTimeOut a llamar de nuevo la función x milisegundos más tarde:

function PrintIframe() { 

     if (window.frames['myname'].innerHTML != "") { 
      window.frames['myname'].focus(); 
      window.frames['myname'].print(); 
     } else { 
      setTimeout(PrintIframe,1000); 
     }  
    } 

Esto funcionó para mí

EDITAR Strange - que tenía una alerta en mi código de prueba que parece hacer funciona. Cuando lo saqué, no funcionó. Lo sentimos :(

De todos modos, esto debe hacerlo utilizando jQuery para conectar un controlador de eventos de carga para el iframe que he probado en IE8 y funciona:.

<html> 
<head> 
    <script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
    function loadiFrame(src) 
    { 
     $("#iframeplaceholder").html("<iframe id='myiframe' name='myname' src='" + src + "' />"); 
    } 

    $(function() 
    { 
     $("#printbutton").bind("click", 
      function() { 
       loadiFrame('test.aspx'); 
       $("#myiframe").load( 
        function() { 
         window.frames['myname'].focus(); 
         window.frames['myname'].print(); 
        } 
       ); 
      } 
     ); 
    }); 
    </script>  
</head> 
<body> 
    <input type="button" id="printbutton" value="Load iFrame" /> 
    <div id="iframeplaceholder"></div> 
</body> 
</html> 
+0

No es para mí :(Una vez más, está bien con html pero no imprime un iframe si fue creado por JQ. – certainlyakey

+0

Bueno, su última elaboración funcionó en la página de prueba, debería investigar más ... – certainlyakey

0
var ifrm = document.createElement("iframe"); 
// ifrm.style.display = "none"; 
document.body.appendChild(ifrm); 
setTimeout(function() { 
    $(ifrm).contents().find("body").html("my html content"); 
}, 1); 
ifrm.onload = function() { 
    ifrm.contentWindow.print(); 
} 
0

Me encontraron esta buscando en la web

$('#preview-iframe').contents().find('html').html(data); 

y lo cambió a

$('#preview-iframe').contents().find('html').html(data).after(function() { 
    document.getElementById("preview-iframe").contentWindow.print(); 
}); 

twigstechtips

8

que he tenido un problema con imprimiendo el contenido del iframeCon el fin de achive esto, utilice el código de abajo:

Por ejemplo, usted tiene iframe:

<iframe id='print-iframe' name='print-iframe'></iframe> 

Entonces JS para imprimir llamada contenido de iframe esta función (funciona tanto en Internet Explorer y otros navegadores):

printIframe('print-iframe'); 
código

de Función:

function printIframe(iFrameId) { 
    var ua = window.navigator.userAgent; 
    var msie = ua.indexOf ("MSIE "); 
    var iframe = document.getElementById(printFrameId); 

    if (msie !== 0) { 
     iframe.contentWindow.document.execCommand('print', false, null); 
    } else { 
     iframe.contentWindow.print(); 
    } 
} 
+0

Esto parece funcionar bien. Sin embargo, creo que es mejor verificar (msie> -1). –

+0

Esto es solo verificación simple :) El origen es: http://support.microsoft.com/ kb/167820 –

+0

Funciona solo una vez. Si vuelvo a hacer clic en el botón, aparece el mensaje "Error de tiempo de ejecución de JavaScript: acceso denegado". Intento imprimir en silencio un documento en PDF. Tengo una tabla con varias entradas y cada entrada se puede "imprimir". Cuando se hace clic en el botón de impresión de la entrada, el src del iframe se actualiza con la nueva url y el código anterior se ejecuta para imprimirlo en silencio. Como dije, funciona una vez pero los clics posteriores, falla con el error de javascript anterior. – Paul

0

sé que esto es un hilo bastante viejo, pero tengo una más ru busto solución para esto.

Se basa en https://stackoverflow.com/a/9648159/3183069 y https://stackoverflow.com/a/831547/3183069

añadí .one() la función por lo que doesnt bucle infinito si se cancela la impresión! También cargo el iframe una vez. Disfrutar de

var $body = $("body"), 
 
    $iframe, 
 
    loadiFrame = function(src) { 
 
    if ($body.children('#full-prog').length == 0) { 
 
     $body.append("<iframe id='full-prog' src='" + src + "' />"); 
 
     $iframe = $("#full-prog"); 
 
     $iframe.one('load', function() { 
 
     $iframe.get(0).contentWindow.print(); 
 
     }); 
 
    } else { 
 
     $iframe.get(0).contentWindow.print(); 
 
    } 
 
    }; 
 

 
$("#printbutton").click(function() { 
 
    loadiFrame('iframe source here'); 
 
});
#full-prog { 
 
    overflow: hidden; 
 
    position: absolute; 
 
    width: 0; 
 
    height: 0; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="button" id="printbutton" value="Load iFrame" />

Cuestiones relacionadas