当前位置:首页 > 技能相关 > JS与JQ > 正文内容

JS 使用JS或JQ关闭打开的网页

admin2年前 (2023-12-30)JS与JQ4870 修订时间:2023-12-31 10:53:42

一、js关闭当前页面的方法

js提供了多种方法关闭当前页面,以下是几种比较常见的方法。

1. window.close()方法,这个方法能够关闭当前窗口或tab页。但是需要注意的是,这个方法只能关闭由js打开的窗口。如果是用户打开的窗口,这个方法没有作用。

function closeWindow() {
    window.close();
}

2. 使用window.open()方法在新的窗口打开一个页面,然后调用该页面中的js代码关闭当前页面。

function closeCurrentPage() {
  var win=window.open("about:blank", "_self");
  win.close();
}

3. 使用window.location.replace()方法将当前页面替换为一个空白的页面,然后关闭该页面。

function closePage() {
    window.location.replace("about:blank");
    window.close();
}

二、要关闭当前打开的页面下面

在web开发中,经常遇到一个页面作为父页面,打开了一个子页面,这时如果想关闭子页面,刷新父页面并重新加载父页面的某个区域,我们可以使用以下代码:

function closeChildAndRefreshParent() {
    var opener = window.opener; // 获取父页面对象 
    window.close(); // 关闭当前窗口 
    if (opener != null && !opener.closed) { // 父页面未关闭 
        opener.location.reload(); // 父页面刷新 
    }
}

三、js关闭当前页面刷新父页面

使用window.opener.reload()方法能够在关闭子页面后刷新父页面。

function closeAndRefreshParent() {
    window.opener.location.reload();
    window.close();
}

四、js页面关闭时触发事件

当页面即将关闭时,我们可以注册onbeforeunload事件进行操作,例如弹出提示框确认是否关闭页面。

window.onbeforeunload = function () {
    return "确定要关闭该页面吗?";
}

五、jquery关闭当前页面

使用jquery关闭当前页面也很简单,直接调用$().remove()即可关闭当前页面。

$(document).ready(function(){
    $("button").click(function(){
        $(this).remove(); // 关闭当前页面
    });
});

六、js关闭页面

除了关闭当前页面外,我们也可以关闭其他页面。

function closeOtherPage() {
    var otherPage = window.open("/other.html", "_self");
    otherPage.close();
}

七、js关闭当前窗口

除了关闭页面外,我们也可以关闭当前窗口。

function closeCurrentWindow() {
    window.open('', '_self', '');
    window.close();
}

八、js如何关闭当前页面

在js中关闭当前页面的方法很多,以下是总结的几种方法。

  1. window.close()方法

  2. window.open()方法打开一个新页面然后关闭当前窗口

  3. window.location.replace()方法替换当前页为一个空白页然后关闭当前窗口

  4. 使用onbeforeunload事件监听页面关闭,并弹出提示框

  5. 使用jquery的$().remove()方法关闭当前页面

九、js怎么关闭当前页面

根据实际需求,选择适合的方法关闭当前页面即可,例如如果为从父页面打开的子页面,可以使用window.opener.location.reload()方法刷新父页面;如果需要在关闭页面时弹出确认框,使用onbeforeunload事件即可;如果需要在子页面关闭后刷新父页面的某个区域,使用window.opener.location.reload()即可。

 您阅读本篇文章共花了: 

免责声明
本站内容均为博客主本人日常使用记录的存档,如侵犯你的权益请联系:lifei@zaiheze.com 546262132@qq.com 沟通删除事宜。本站仅带访问端口形式使用,已杜绝搜索引擎爬取。

扫描二维码推送至手机访问。

版权声明:本文由LIFEI - blog发布,如需转载请注明出处。

本文链接:http://www.lifeiai.com/index.php?id=352

标签: javascript
分享给朋友:
返回列表

没有更早的文章了...

下一篇:JS 使用js库将网页导出为PDF(仅限一页A4)

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。