时间戳

首页 > 解决方案 > 如何在窗口中显示计数器并使其关闭？

javascript - 如何在窗口中显示计数器并使其关闭？

问题描述

我有这段代码，其中单击按钮时会打开一个窗口并出现一个计数器，该计数器是 1 到 100 之间的随机数，计数为 0 并且窗口关闭，但我不太清楚自己在做什么错误，因为我打开的窗口中没有任何内容。在这里我留下部分 html 代码，因为我决定通过提供一个按钮和 javascript 来打开它。

var ventana;

function abrir() {
  ventana = window.open("", "new_window", "width=800,height=500,status=no,toolbar=no,menubar=no");
}

window.onload = contar;

function contar() {
  var contartiempo = Math.floor(Math.random() * 100);
  ventana.document.getElementById('contador').innerHTML = contartiempo;
  if (contartiempo == 0) {
    ventana.close();
  }
  ventana.document.write(" tu contador:<span id = contador></span>") //quiero que se muestre en la ventana abierta el contador
}
<body>
  <input type="submit" value="Abrir" onclick="abrir()">
</body>

标签： javascript

解决方案

所以，这段代码有很多问题：

  1. 您正在加载加载contar函数，直到那时，ventana 才会undefined出现，因此当您执行类似的操作ventana.whatever（尝试访问未定义的属性）时会出现错误。

  2. 由于新页面中的文档在创建时没有跨度id = contador，因此该行ventana.document.getElementById('contador').innerHTML = contartiempo;也会失败。

要解决这个问题：

var ventana;

function abrir() {
  ventana = window.open("", "new_window", "width=800,height=500,status=no,toolbar=no,menubar=no");

  contar()
}

function contar() {
  if (ventana) {
    var contartiempo = Math.floor(Math.random() * 100);
    ventana.document.write(" tu contador:<span id = contador></span>") //quiero que se muestre en la ventana abierta el contador
    ventana.document.getElementById('contador').innerHTML = contartiempo;
    if (contartiempo == 0) {
      ventana.close();
    }
    
  }
}

在这里，我在contar打开新窗口后单击父文档中的按钮调用函数。然后我将跨度和其他布局放在页面上ventana.document.write。然后我们添加innerHTML一个span。

HTML 部分不需要更改。

推荐阅读