foreword

In the front-end page, it is very common to use a layer to open a window for user input or selection, but sometimes in order to complete an operation, multiple windows need to be popped up for selection, input or prompt, so when closing the window, it is necessary to specify to close any Window instead of closing wrong or messed up

This article describes how a layer can close a specified window in multiple windows and how to close all windows at once

1. Close the specified window

1. Close the specified window: layer.close(index) - recommended usage

When opening a window with layer.open() and other methods, there will be a return value index. At this time, we only need to record the return value index corresponding to each window, and use layer.close(index) to close the specified window

var index1 = layer.open();
var index2 = layer.alert();
var index3 = layer.load();
var index4 = layer.tips();

layer.close(index1);//关闭第1个窗口
layer.close(index3);//关闭第3个窗口

2. Close the latest pop-up window: layer.close(layer.index)

We can also choose not to record the index value of each pop-up window, but use layer.index to get the index of the latest opened window, and close the latest opened window each time

The advantage of this method is that it is relatively simple, because what we close is often the latest pop-up, the disadvantage is that there is no way to close the specified window, only the latest one

layer.open();
layer.alert();
layer.load();
layer.tips();

layer.close(layer.index);//关闭最新弹出的窗口

3.iframe closes itself: parent.layer.close(index)

The same as the logic of closing the specified window, first obtain the index value of the window to be closed, and then call parent.layer.close(index) to close the specified window

var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭

2. Close all windows: layer.closeAll()

layer.closeAll(); //疯狂模式，关闭所有层
layer.closeAll('dialog'); //关闭信息框
layer.closeAll('page'); //关闭所有页面层
layer.closeAll('iframe'); //关闭所有的iframe层
layer.closeAll('loading'); //关闭加载层
layer.closeAll('tips'); //关闭所有的tips层

3. Automatically refresh the page after closing the window: window.parent.location.reload();

For example, when adding user information, the interface generally needs to be automatically refreshed after the addition is completed to display the latest user list information

success: function(data){
    
    
    var res = eval('(' + data + ')');
    if(res.status == '1'){
    
    
        layer.msg("添加成功！");
        layer.alert("添加成功！",function(){
    
    
            window.parent.location.reload();//刷新父页面
            parent.layer.close(index);//关闭弹出层
        });
    } else{
    
    
        layer.msg("添加失败！");
    }
}

For page refresh and reload, please refer to: JS implements page refresh and reload function (close the current window)

Part of the content of this article is referenced from: Closing problem of layer pop-up layer - close the current pop-up layer after execution

JavaScript: layer closes the specified popup window