美文网首页
html a标签跳转前的confirm验证弹出框

html a标签跳转前的confirm验证弹出框

作者: 零_WYF | 来源:发表于2018-07-12 19:51 被阅读544次

1.准备工作

下载并引入layer.js文件
网址:http://layer.layui.com/

2.前端页面

将要跳转的页面传递给js处理函数 del_btn()

<a href="javascript:del_btn('/user/del_role?nid=' + {{ role.id }});"title="删除">删除 </a>

3.js处理函数

function del_btn(url) {
        layer.confirm('确定删除?', {
                btn: ['删除', '取消'] //按钮
            }, function () {
                layer.msg('删除成功', {icon: 1});   //点击删除按钮,页面跳转
                self.location.href =  url   
            }, function () {
                layer.msg('取消', {});   // 点击取消按钮,弹出框消失,页面不跳转
            });
        }

4.效果

效果.png
取消.png
删除.png

相关文章

网友评论

      本文标题:html a标签跳转前的confirm验证弹出框

      本文链接:https://www.haomeiwen.com/subject/tiorpftx.html