如何在 X 秒后应用 window.close() ?

2024-03-24

我有一个弹出窗口,其中包含 onclick 操作,可以在按下提交按钮时关闭该框:

<input type="submit" name="submit" value="submit" onclick="javascript: window.close();">

我正在尝试将其调整为在单击提交按钮关闭后等待 3 秒。

我读到一篇文章建议在以下位置使用它:

<script> 
setTimeout("window.close()",3000) 
</script>

但无论是否单击按钮,它都会在 3 秒后关闭弹出窗口。

我该如何调整它以与按钮一起使用?


您的第一个版本按编写的方式工作

<input type="submit" name="submit" value="submit" onclick="javascript: window.close();">

因为单击时它将关闭窗口。

您的第二个版本按编写的方式工作。但你似乎有点困惑,所以让我解释一下。

<script> 
 setTimeout("window.close()",3000) 
</script>

当它内联到您的 html 文件中时,它将在视图渲染时到达它时执行。执行时,这段代码表示从字符串参数构造一个新函数,然后在 3000 毫秒内调用它。

它不与任何东西绑定,只是在渲染引擎遇到它时运行。

为了将其与某些东西联系起来(而不仅仅是像第一个版本中所示那样采用将其放置在元素上的快捷方式),您将需要一个event。在 javascript 中,该事件将是点击事件。为了访问单击事件,您需要在要处理事件的元素上放置一个 clickeventhandler。为了访问该元素,您必须在加载 DOM 时查询页面以获取该元素。

querySelector所有文档 https://developer.mozilla.org/en-US/docs/Web/API/Document.querySelectorAll

<script>
window.onload = function(){ //this line of code will wait for the DOM to load
 //once loaded, it will execute the "anonymous" function which is the code here

 //now in here we can find the element
 //since there is no id or class, we can look for an input with name=submit
 var submitInput = document.querySelectorAll("input[name=submit]")[0];

 //once the element is found, we can attach the handler to it
 submitInput.onclick = function(){ //once again this "anonymous" function executes when the event fires
  //in here you can execute the timeout
  //lets use an anonymous function instead of constructing one from a string
  setTimeout(function(){
   window.close();
  },3000);
 };
};
</script>

完成此操作后,您可以从元素中删除 onclick 事件处理程序

<input type="submit" name="submit" value="submit" />

这就是适合您情况的最佳实践方法。

jQuery

如果您打算使用 jQuery 来执行此操作,则可以使用 document.ready 功能的快捷方式(如等待所有元素可用),然后在该快捷方式的回调中您将定位该元素(在 jQuery 中)你使用 css-ish 选择器),然后告诉 jQuery 注册点击事件,这涉及到另一个回调函数。

它看起来像这样:

<script>
 $(function(){//document.ready shortcut
  $("input[name=submit]").click(function(){//target element and request click event
   setTimeout(function(){window.close();},3000);//timeout code to close window
  });
 });
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 X 秒后应用 window.close() ? 的相关文章

随机推荐

  • 将函数从纯 React 转换为 Redux React

    在纯反应中 我编写了一个调用的函数componentDidMount getTasks userId query statusTask pageNumber gt let check axios url api v1 beta userId
  • fortran 中的多重定义链接错误(ifort - gfortran)

    嗯 我有这个问题 描述很长 但我认为很容易解决 我有三个文件 nrtype f90 它有一些愚蠢的定义 但它被以下文件使用 module nrtype integer parameter I4B SELECTED INT KIND 9 in
  • 如果您强制推送到具有现有拉取请求的分支,会发生什么?

    我正在开发一个 git 分支 该分支目前是 github 上已关闭拉取请求的一部分 在最初的拉取请求之后 我做了一些额外的提交 将这些提交推送到 github 然后恢复这些提交并重新提交它们 因为我需要修改提交 现在 如果我想将这些提交推送
  • AVPlayer 消除了 Swift 2.2 中的观察者崩溃

    我有一个视频应用程序 是我在 Swift 1 中构建的 我一直在尝试迁移到 Swift 2 2 除了与观察者有关的奇怪崩溃之外 这一切 最终 都正常工作 func removeObservers print REMOVING OBSERVE
  • 两个 NSDate 之间的天数[重复]

    这个问题在这里已经有答案了 如何确定两次之间的天数NSDate值 也考虑到时间 The NSDate值可以是任何形式 NSDate date takes 具体来说 当用户在我的 iPhone 应用程序中进入非活动状态时 我存储以下值 exi
  • 如何检查变量是否是类的实例?

    在Java中 你可以这样做instanceof 有 Ruby 等价的吗 几乎一模一样 您可以使用Object s instance of method a instance of String gt true a instance of O
  • 使用 Perl split 函数,但保留某些分隔符

    我有一个字符串需要根据某个字符进行拆分 但是 当字符串两侧是数字时 我只需要在其中一个字符上拆分字符串 相同的字符存在于字符串中的其他位置 但两侧会有一个字母 至少在一侧 我尝试按如下方式使用 split 函数 使用 x 作为相关字符 my
  • 更改四开中的标题大小和颜色(html 输出)

    我有一个带有 HTML 渲染的四开文件 我想更改标题的大小和颜色 我应该如何操作 最小的例子 title Cars format html MTCars r head mtcars 您可以使用css直接在您的代码中 指定 title仅将更改
  • NuGet 打包和引用 dll

    背景 我有两个程序集 称为 A 和 B A 引用了 B A 还引用了一些其他 dll Microsoft Enterprise Library Data 和 Microsoft Enterprise Library Common 我认为这些
  • spring security - expiredUrl 不起作用

    我需要配置expired url在我的 Spring MVC 应用程序中 这是我的努力 但没有效果 Override protected void configure HttpSecurity http throws Exception h
  • 在 Android Studio 中调试 C++ 时“启动 LLDB 服务器”

    我想在 Android Studio 中调试 C 模块 我在 android studio 中创建了一个支持 C 的项目 When i debug this is what i get 启动 LLDB 服务器 永远不会停止 如果我停止调试
  • $_SERVER['document_root'] 返回 /htdocs 而不是 /public_html

    我正在寻找切换到新主机的机会 他们提供了这个不错的小 临时 URL 以便在切换之前测试您的文件 一切都很好 花花公子 所以我复制了所有文件 在每一页的顶部我require来自服务器的另一个文件 存储在public html includes
  • SQL 按匹配字段数对结果进行排序

    这里有一个复杂的 SQL 问题 我目前有一个匹配多个字段的 SELECT 语句 如下所示 SELECT field1 field2 field3 field4 field5 FROM table WHERE field1 variable
  • 转换为枚举与 Enum.ToObject

    我最近看到一个项目正在使用这个style SomeEnum Enum ToObject typeof SomeEnum some int 而不是这种风格 SomeEnum some int 为什么使用前者 这只是风格问题吗 来自 MSDN
  • intl 扩展名应该可用 symfony

    现在如果我去http localhost 8000 config php http localhost 8000 config php它告诉我 安装并启用 intl 扩展 用于验证器 所以我所做的是 Checked etc php 7 0
  • Mac App Store 应用程序 iTMSTransporter 错误

    我正在尝试将我的 pkg 文件发送给 Apple 但系统显示 Transporter 正在搜索更新的软件组件 并且该进程始终在运行 无法停止 这是我的活动日志 看起来像是上传错误 我已经安装了 iTMSTransporter 1 7 7 p
  • Spring 的 Azure Pipeline Gradle 构建失败

    我尝试通过 Yaml 管道在 Azure 上构建和部署 Spring API 但我在 spring 应用程序 gradle 构建期间收到错误消息 Error home vsts work 1 s gradlew failed with re
  • ionic 5 强制浏览器应用程序的浅色主题

    我已经构建了这个应用程序https cvirus app https cvirus app并在浏览器上构建和部署 在 Android 手机上的 Chrome 浏览器上 它会呈现深色背景 因为默认情况下似乎应用了深色主题 我想在任何地方强制使
  • Postgres LIKE 将列值作为子字符串

    我正在尝试编写一个 WHERE 语句 该语句将匹配列值是另一个字符串的子字符串的行 例如 我可能有一个event记录与name现场Edward Sharpe 我想做这样的事情 SELECT FROM events WHERE name LI
  • 如何在 X 秒后应用 window.close() ?

    我有一个弹出窗口 其中包含 onclick 操作 可以在按下提交按钮时关闭该框