layui的确认弹出层的玩法

周杰伦本人

发布于 2023-10-12 14:12:23

4180

发布于 2023-10-12 14:12:23

项目中用的windows的confirm确认框感觉很low 改了一下遇到两个问题使用layui前：

function outExcel(url) {
    if (confirm("导出前请确认相关信息！你确定导出吗？")) {
        var projectUrl =window.document.location.pathname;
        var projectName = projectUrl.substr(0,projectUrl.substr(1).indexOf('/')+1);
        var oldAction=$("#searchForm").attr("action");
        $("#searchForm").attr("action",projectName+url);
        $("#searchForm").submit();
        $("#searchForm").attr("action",oldAction);
    }
}

正确的使用layui后：

function outExcel(url) {
    layer.confirm('导出前请确认相关信息！你确定导出吗？', {
        btn: ['确定','取消'] //按钮
    }, function(index){
        layer.close();
        var projectUrl =window.document.location.pathname;
        var projectName = projectUrl.substr(0,projectUrl.substr(1).indexOf('/')+1);
        var oldAction=$("#searchForm").attr("action");
        $("#searchForm").attr("action",projectName+url);
        $("#searchForm").submit();
        $("#searchForm").attr("action",oldAction);
        layer.close(index);
    }, function(){
    });
    return false;

1.第一个问题：我用的根据id提交表单然后它不用点确认一闪而过就直接提交了解决方案：后边加了个return false;

还有可能就是表单默认提交了我们要阻止表单的默认提交表单内的 <button>未指定类型时，默认的类型为submit，可以显式的修改为<button type="button">来阻止表单提交 2.第二个问题：在点确认弹出框后不关闭弹出框解决方案： layer.close(index);

参考文献： http://zhiku8.com/layer-confirm-not-close.html https://blog.csdn.net/whd526/article/details/78178451

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2023-10-11，如有侵权请联系 cloudcommunity@tencent.com 删除

action