使用javascript打印动态内容

时间:2011-08-18 11:49:07

标签: javascript internet-explorer printing

问题

我们有表格的页面 用户填写表格并提交 我需要打印包含表格和其他内容数据的页面。

代码#1

$(document).ready(function($){
 $('input[name=sumb_but]').bind('click', function(e){
  e.preventDefault();
  var print_text = "<p>Test " + $('#form').serialize() + "</p>";
  var newWin = window.open('','printWindow','Toolbar=0,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=0,Resizable=0');
  newWin.document.body.innerHTML = print_text;
  newWin.print();
  });
});

酷,

  1. 我需要具体的css
  2. 打印窗口在内容加载之前出现... ooops
  3. 确定!

    代码#2

    $(document).ready(function($){
     $('input[name=sumb_but]').bind('click', function(e){
      e.preventDefault();
      var print_text = "<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'> <html xmlns='http://www.w3.org/1999/xhtml'> <head> <meta http-equiv='Content-Type' content='text/html; charset=windows-1251' /> <title>Оформление доверенности (простая письменная форма)</title> <link rel='stylesheet' type='text/css' href='/css/print_forms/warrant.css'> </head> <body> <p>Test " + $('#form').serialize() + "</p></body><script type='text/javascript'>window.print();</script></html>";
      var newWin = window.open('','printWindow','Toolbar=0,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=0,Resizable=0');
      newWin.document.write(print_text);
      });
    });
    
    1. document.write - 在其他情况下css未加载
    2. 在内容中添加了“window.print()”
    3. 在所有浏览器中都可以正常工作,不在IE中 - 窗口内容加载成功而没有打印对话框。 我需要帮助!
      附:
      CSS with media =“print” - 由于某些原因,这个案例不是很好的解决方案。

1 个答案:

答案 0 :(得分:0)

$(document).ready(function($){
 $('input[name=sumb_but]').bind('click', function(e){
  e.preventDefault();
  var print_text = "<p>Test " + $('#form').serialize() + "</p>";
  var newWin = window.open('','printWindow','Toolbar=0,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=0,Resizable=0');
  newWin.document.body.innerHTML = print_text;
  newWin.document.body.onload = function() { newWin.print(); }   

  });
});

这可以帮助