关闭子窗口父窗口刷新

一、方法一：使用window.open()方法。

在父窗口中的html代码：

<a class="btn btn-primary "  id="addnews"> 添加新闻</a>

在父窗口中的js代码，通过window.open()打开子窗口：

$("#addnews").click(function(){
    var url='manage/newsAdd.jsp?userId=<%=user.getNumber()%>'; //转向网页的地址;
    var name=''; //网页名称，可为空;
    var iWidth=700; //弹出窗口的宽度;
    var iHeight=400; //弹出窗口的高度;
    //window.screen.height获得屏幕的高，window.screen.width获得屏幕的宽
    var iTop = (window.screen.height-30-iHeight)/2; //获得窗口的垂直位置;
    var iLeft = (window.screen.width-10-iWidth)/2; //获得窗口的水平位置;
    window.open(url,name,'height='+iHeight+',innerHeight='+iHeight+',width='+iWidth+',innerWidth='+iWidth+',top='+iTop+',left='+iLeft+',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no');   
  });

子窗口中的html代码：

<%
    String result = (String) request.getParameter("res");
  %>
  <div class="container">
      <form method="post" action="NewsAdd?userId=<%=userId%>" id="newsform">
        <div class="panel panel-primary" >
            <textarea id="newsContent" name="newsContent" required="required" oninvalid="setCustomValidity('请输入新闻内容！')" oninput="setCustomValidity('')"
                 autofocus="autofocus" placeholder="请输入滚动新闻内容" rows="10" cols="60" style="border:0;"></textarea>
              </div>             
        </div> 
        <div style="margin:20px auto;">
          <input class="btn btn-primary" type="submit" value="提 交" id="submitbtn" /> <!--提交后返回该页面，返回值为res-->
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <button class="btn btn-default" onclick="window.close()" id="cancel">取 消</button>          
        </div>
      </form>
    </div>
  </div>
  子窗口中的js代码：
  <script>    
    $(document).ready(function(){
      var result = <%=result%>;
      if(result==1){ //上传成功，登录成功等等        
        window.opener.location.reload();
        window.opener=null;                 //刷新父窗口，关闭子窗口
        window.close();
      }   
    });  
  </script>

这种方法没有采用遮蔽效果。

二、方法二：使用layer （http://sentsin.com/jquery/layer/ ）的iframe层

首先在父窗口和子窗口页面添加<script src="Resources/layer/layer.min.js"></script>

在父窗口中的html代码：

<a class="btn btn-primary "  id="addnews"> 添加新闻</a>

在父窗口中的js代码，通过iframe()打开子窗口：

$('#addnews').on('click', function(){
    $.layer({
      type: 2, //iframe
      shade: [0.5,'#000'],
      fix: false,
      title: '添加一条记录',
      maxmin: false,
      border: [0],
      closeBtn: [0, true],
      fadeIn: 300,
      iframe: {src:'manage/newsAdd.jsp?userId=<%=user.getNumber()%>',scrolling: 'no'},
      area: ['580px' , '430px'],
      close: function(index){  //点击layer右上角关闭按钮触发的事件
        location.assign('NewsModify?userId=<%=user.getNumber()%>'); 
      }
    });
});

子窗口中的html代码：

<%
    String result = (String) request.getParameter("res");
  %>
  <div class="container">
      <form method="post" action="NewsAdd?userId=<%=userId%>" id="newsform">
        <div class="panel panel-primary" >
            <textarea id="newsContent" name="newsContent" required="required" oninvalid="setCustomValidity('请输入新闻内容！')" oninput="setCustomValidity('')"
                 autofocus="autofocus" placeholder="请输入滚动新闻内容" rows="10" cols="60" style="border:0;"></textarea>
              </div>             
        </div> 
        <div style="margin:20px auto;">
          <input class="btn btn-primary" type="submit" value="提 交" id="submitbtn" /> <!--提交后返回该页面，返回值为res-->
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <button class="btn btn-default" onclick="window.close()" id="cancel">取 消</button>          
        </div>
      </form>
    </div>
  </div>
  子窗口中的js代码：
  $(document).ready(function(){
      var result = <%=msg%>;
      var index = parent.layer.getFrameIndex(window.name);
      if(result==1){ //上传成功              
        parent.location.reload(); //刷新父窗口
        parent.layer.close(index);
      }
      
      $("#cancel").click(function(){
        parent.layer.close(index);      
      });
    });