layer关闭当前窗口页面以及确认取消按钮

最新推荐文章于 2022-02-15 21:43:26 发布

前端路上迷茫的小鲨鱼

最新推荐文章于 2022-02-15 21:43:26 发布

阅读量1w

点赞数

CC 4.0 BY-SA版权

分类专栏： layui

本文链接：https://blog.youkuaiyun.com/Guoyu1_/article/details/86222337

layui 专栏收录该内容

34 篇文章

订阅专栏

本文展示了使用layui框架中layer组件实现的前端开发交互示例，包括确认对话框、消息提示和模态窗口的创建，提供了具体代码实现，帮助开发者理解如何在网页中实现丰富的用户交互。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function demo() {
    layer.confirm('您是如何看待前端开发？', {
        btn: ['重要','奇葩'] //按钮
    }, function(){
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);//关闭当前页
        layer.msg('的确很重要', {icon: 1});
    }, function(){
        layer.msg('也可以这样', {
            time: 1000, //20s后自动关闭
            btn: ['明白了', '知道了']
        });
    });
}

var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);//关闭当前页

确认及取消按钮

layui.use('layer',function () {
    layer.confirm("请问是否确定删除，删除后不可恢复？", {
        btn: ["确定","取消"] //按钮
    }, function(){
        confirm('确定？');
        layer.closeAll('dialog');
    }, function(){
        alert('您已点击取消')
    });
});

layui.use('layer',function () {
    layer.open({
        type: 1,
        title: '订单详情',
        closeBtn: 1,
        fix: false,
        offset: '100px' ,
        btn: ['确定', '取消'],
        content: '姓名：<input type="text">',
        success: function (layero, index) {

        },
        cancel: function (index) {
            alert("OK")
        }
    })
})