window.open遇到的问题的详细解说

需求如下：

   在一个WEB系统中，主页面index.jsp包含了head.jsp   left.jsp   document.jsp等等，现在需要在document.jsp 上有一个按钮，点击他的时候就弹出新页面将这个页面 document.jsp预览出来，并增加打印和取消两个按钮。

 

我刚做这个的时候，先从网上找了一大堆东西，比如

var newwin=window.open(window.location.href); 这一句就已经把document.jsp的内容完全写入到新页面，包括样式，我没有新建文件了

newwin.document.write("<script>..............");

newwin.document.write("<input .......>");我加上这些需求之后，原来的页面就没了。不管加什么 原来的就没有了，并且这种方法不好，因为我要打印的不是document.jsp的全部，因此这样的方法或许可行，但是很快被我抛弃。。就算用了newwin.document.write("<script 隐藏不需要的>");也毫无意义

 

我改成新建一个JSP页面的方法。

 新建一个printBody.jsp的页面，给他添加两个按钮

   function printPage(){
    var bp = document.getElementById("btPrint");
    var bc = document.getElementById("btCancel");
    if(bp!=undefined&&bc!=undefined)
    {
     bp.style.display = "none";// 将该打印按钮在点击的时候设置隐藏
     bc.style.display = "none";//取消按钮隐藏
    }
    window.print();//打印页面
   }

<input type="button" value="打印" size="6" οnclick="printPage()" id="btPrint">

<input type="button" value="取消" size="6" οnclick="window.close();" id="btCancel">

 

给printBody.jsp一个DIV  这个DIV用来接收document.jsp需要传过来的内容

<div id="printBody"></div>

 

→  当点击document.jsp中的打印时，调用window.open("printBody.jsp");

      打开之后，将document.jsp的内容赋给printBody.jsp

  var printBody=document.getElementById("printBody");//拿到printBody.jsp的那个DIV
  if(undefined==printBody){//需要对这个DIV判断是否存在
   alert("出错了");
   return false;
  }
  var nowdiv=window.opener.document.all("showTabBody");//因为是由document.jsp进入printBody.jsp,所以document.jsp被称为opener
  if(undefined==nowdiv){//对document.jsp中的DIV进行判断，不存在则返回
   return false;
  }
  printBody.innerHTML=nowdiv.innerHTML;//将document.jsp中的内容放到printBody.jsp中

 

这里遇到了一个严重的问题，因为页面加载的过程中，是从上到下的，如果有JS就先JS，然后CSS，JAVA代码，最后才是HTML静态页面，但是很多时候是JS用到了静态页面中的元素，所以就会造成未定义的情况。

window.open()方法是一个异步的方法，他在执行了这个方法之后，立刻就执行下一句代码了，不会等这HTML页面加载完毕，所以就造成了未定义的情况。

所以我们一般是使用延迟加载事件 onload() 

但是onload()方法如果不写在加载的HTML页面的话，IE就不支持了，火狐支持，我朋友测试过了

 

→ 将蓝色的代码写在printBody.jsp中就可以了  但是要加上 window.οnlοad=function(){ 蓝色代码 }

opener：由A页面打开到B页面，那么A页面就是opener  

另外 var newwin=window.open("a.jsp");  那么newwin代表a.jsp  newwin.document.getElementById("id")就可以取东西了