Javascript 用闭包打开和关闭窗口_Javascript_Closures

Javascript 用闭包打开和关闭窗口

javascript

Javascript 用闭包打开和关闭窗口,javascript,closures,Javascript,Closures,我想点击两个按钮打开和关闭一个窗口。打开按钮打开窗口，关闭按钮关闭窗口。简单我通过两个独立的函数实现了这一点。你们猜对了。一个用于打开，另一个用于关闭但是，这需要将myWindow对象设置为全局对象。为了避免这种情况，我想闭包是否可以方便地将myWindow对象的范围限定为手动定义的函数。我试着做一些类似下面粘贴的代码的事情，但不确定如何让它工作。现在，publicClose未定义再次强调，我的重点是避免任何全球宣言第5-6天开窗关窗函数openWindow（）{ var

我想点击两个按钮打开和关闭一个窗口。打开按钮打开窗口，关闭按钮关闭窗口。简单

我通过两个独立的函数实现了这一点。你们猜对了。一个用于打开，另一个用于关闭

但是，这需要将
myWindow
对象设置为全局对象。为了避免这种情况，我想闭包是否可以方便地将
myWindow
对象的范围限定为手动定义的函数。

我试着做一些类似下面粘贴的代码的事情，但不确定如何让它工作。现在，

publicClose

未定义

再次强调，我的重点是避免任何全球宣言


第5-6天

开窗
关窗

函数openWindow（）{
var myWindow=windowCenter（“，”，400，200）；
函数windowCenter（url、标题、w、h）{
//修复了大多数浏览器Firefox的双屏幕位置
var ScreenLeft=window.ScreenLeft！=未定义？window.ScreenLeft:screen.left；
var ScreenTop=window.ScreenTop！=未定义？window.ScreenTop:screen.top；
宽度=window.innerWidth？window.innerWidth:document.documentElement.clientWidth？document.documentElement.clientWidth:screen.width；
高度=window.innerHeight？window.innerHeight:document.documentElement.clientHeight？document.documentElement.clientHeight:screen.height；
变量左=（（宽度/2）-（宽度/2））+屏幕左；
变量顶部=（（高度/2）-（高度/2））+屏幕顶部；
var myWindow=window.open（“，”“，”滚动条=yes，宽度=“+w+”，高度=“+h+”，顶部=“+top+”，左侧=”+left）；
myWindow.document.write（“我是子窗口。”）
//将焦点放在新窗口上
if（window.focus）{
myWindow.focus（）；
}
}
函数closeWindow（）{
myWindow.close（）；
}
var publicClose={
关闭：关闭窗口；
}
返回公共关闭；
}

如果您想让publicClose成为全局的，您必须将其定义为全局的；-）

此外，您的关闭函数调用错误。固定的：

    <li><button class="btn btn-default" onclick="publicClose.close()">Close Window</button></li>

关闭窗口

如果您想让publicClose成为全局的，您必须将其定义为全局的；-）

此外，您的关闭函数调用错误。固定的：

    <li><button class="btn btn-default" onclick="publicClose.close()">Close Window</button></li>

关闭窗口

这是一份工作副本

<title>Day 5-6</title>

<script type="text/javascript">
  var closeWindow;  
  function openWindow() {
    var myWindow;
    windowCenter("", "", 400, 200);

    function windowCenter(url, title, w, h) {
      // Fixes dual-screen position                         Most browsers      Firefox
      var ScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.left;
      var ScreenTop = window.screenTop != undefined ? window.screenTop : screen.top;

      var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
      var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;

      var left = ((width / 2) - (w / 2)) + ScreenLeft;
      var top = ((height / 2) - (h / 2)) + ScreenTop;
      myWindow = window.open("", "", 'scrollbars=yes, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
      myWindow.document.write("<strong>I am child window.</strong>");
        // Puts focus on the newWindow
      if (window.focus) {
        myWindow.focus();
      }
    }

    closeWindow = function() {
      myWindow.close();
    }

  }

  function publicClose() {
      closeWindow();
  }

</script>

<body>
  <div class="buttons">
    <ul class="list-inline">
      <li>
        <button class="btn btn-default" onclick="return openWindow();">Open Window</button>
      </li>
      <li>
        <button class="btn btn-default" onclick="publicClose()">Close Window</button>
      </li>
    </ul>
  </div>


</body>

第5-6天
var关闭窗口；
函数openWindow（）{
var-myWindow；
windowCenter（“，”，400，200）；
函数windowCenter（url、标题、w、h）{
//修复了大多数浏览器Firefox的双屏幕位置
var ScreenLeft=window.ScreenLeft！=未定义？window.ScreenLeft:screen.left；
var ScreenTop=window.ScreenTop！=未定义？window.ScreenTop:screen.top；
var width=window.innerWidth？window.innerWidth:document.documentElement.clientWidth？document.documentElement.clientWidth:screen.width；
var height=window.innerHeight？window.innerHeight:document.documentElement.clientHeight？document.documentElement.clientHeight:screen.height；
变量左=（（宽度/2）-（宽度/2））+屏幕左；
变量顶部=（（高度/2）-（高度/2））+屏幕顶部；
myWindow=window.open（“，”，“滚动条=是，宽度=”+w+”，高度=“+h+”，顶部=“+top+”，左侧=”+left）；
myWindow.document.write（“我是子窗口。”；
//将焦点放在新窗口上
if（window.focus）{
myWindow.focus（）；
}
}
closeWindow=函数（）{
myWindow.close（）；
}
}
函数publicClose（）{
关闭窗口（）；
}


开窗


关窗

变化是什么？我没有返回一个对象，而是将close window分配给一个全局变量，这将创建一个clousure of

openWindow

函数

在

windowCenter

函数中，

myWindow

不是新变量，而是来自

openWindow

上下文的变量。而且我不会从

windowCenter

函数返回任何内容

从

openWindow

上下文中删除了

publicClose

，并在全局上下文中添加了

publicClose

函数。但这是可以避免的，可以通过点击按钮直接调用关闭窗口

<title>Day 5-6</title>

<script type="text/javascript">
  var closeWindow;  
  function openWindow() {
    var myWindow;
    windowCenter("", "", 400, 200);

    function windowCenter(url, title, w, h) {
      // Fixes dual-screen position                         Most browsers      Firefox
      var ScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.left;
      var ScreenTop = window.screenTop != undefined ? window.screenTop : screen.top;

      var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
      var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;

      var left = ((width / 2) - (w / 2)) + ScreenLeft;
      var top = ((height / 2) - (h / 2)) + ScreenTop;
      myWindow = window.open("", "", 'scrollbars=yes, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
      myWindow.document.write("<strong>I am child window.</strong>");
        // Puts focus on the newWindow
      if (window.focus) {
        myWindow.focus();
      }
    }

    closeWindow = function() {
      myWindow.close();
    }

  }

  function publicClose() {
      closeWindow();
  }

</script>

<body>
  <div class="buttons">
    <ul class="list-inline">
      <li>
        <button class="btn btn-default" onclick="return openWindow();">Open Window</button>
      </li>
      <li>
        <button class="btn btn-default" onclick="publicClose()">Close Window</button>
      </li>
    </ul>
  </div>


</body>

第5-6天
var关闭窗口；
函数openWindow（）{
var-myWindow；
windowCenter（“，”，400，200）；
函数windowCenter（url、标题、w、h）{
//修复了大多数浏览器Firefox的双屏幕位置
var ScreenLeft=window.ScreenLeft！=未定义？window.ScreenLeft:screen.left；
var ScreenTop=window.ScreenTop！=未定义？window.ScreenTop:screen.top；
var width=window.innerWidth？window.innerWidth:document.documentElement.clientWidth？document.documentElement.clientWidth:screen.width；
var height=window.innerHeight？window.innerHeight:document.documentElement.clientHeight？document.documentElement.clientHeight:screen.height；
变量左=（（宽度/2）-（宽度/2））+屏幕左；
变量顶部=（（高度/2）-（高度/2））+屏幕顶部；
myWindow=window.open（“，”，“滚动条=是，宽度=”+w+”，高度=“+h+”，顶部=“+top+”，左侧=”+left）；
myWindow.document.write（“我是子窗口。”；
//将焦点放在新窗口上
if（window.focus）{
myWindow.focus（）；
}
}
closeWindow=函数（）{
myWindow.close（）；
}
}
函数publicClose（）{
关闭窗口（）；
}


O