layui弹框里的表单提交,要加验证还要加禁止连续点击提交这两个需求没法同时实现

提问 已结 14 198
jrxiang
jrxiang 2019-9-9
悬赏:20飞吻
版本:layui 浏览器:
最近在做的项目,form表单在弹框里面,我的做法是,open里面加两个btn,保存和取消按钮,而且刚把验证加上,但是呢,还要做禁止连续点击的功能,所以由于保存按钮是用a标签做的,不能添加disabled事件,所以出了问题,导致这两个功能不能兼顾,但是现在想要换成button事件,套了一下没啥头绪,希望有人能指点一下.
回帖
  • 点击之后设置一个变量为false 该变量为false的时候 代码直接return就好了啊,验证通过之后变量转回true
    0 回复
  • 表单验证后加上
    var index = layer.load(2, {time: 10*1000}); //又换了种风格,并且设定最长等待10秒
    请求 结束后关闭
    //关闭
    layer.close(index);
    遮罩有防止连点的作用
    0 回复
  • lll_lll
    2019-9-9
    弹出层中嵌套表单,交建议还是用lay-submit提交按钮,最好不要用弹出层的按钮(应为你的按钮毕竟是操作表单提交的,用弹出层的按钮不光对验证不方便、获取表单值不方便,还有就是你这种情况也难操作)
    0 回复
  • jrxiang
    2019-9-9
    @懒人一个 666 是解决了重复点击了,但是点击完之后,弹框关不了了.
    这是哪里写错了嘛
    0 回复
  • jrxiang
    2019-9-9
    @lll_lll 是的,但是我想要button那种提交方式,套不进去,如果实在不行我就只能用button了
    0 回复
  • @jrxiang 你放的位置不对
    0 回复
  • jrxiang
    2019-9-9
    @再来一哦 很遗憾这个真不行
    这个办法我试过,但是用了这个办法,原来加的验证就没用了,就比方说我加个非空验证,没这么写之前是正常的,这么写了之后是不能连续点击提交了,但是,表单为空的时候,他也能提交了,以前加的验证没用了,所以感觉很矛盾
    0 回复
  • @jrxiang 验证之后再转为true啊
    0 回复
  • lll_lll
    2019-9-9
    @jrxiang 怎么会嵌套不进去呢(你是要嵌套在弹出层上吗,你肯定不好嵌套呀,你只需要放在内容表单中就行)
    如下
    <#--弹窗页面内容-->
    <div id="addCouponCode" style="display: none;padding: 20px;">
    <form class="layui-form layui-form-pane" lay-filter="addCouponCode" action="">
    <div class="layui-form-item">
    <label class="layui-form-label">券码名称</label>
    <div class="layui-input-block">
    <input name="name" type="text" autocomplete="off" lay-verify="required|textSize" size="64" placeholder="请输入" class="layui-input">
    </div>
    </div>
    <br>
    <div class="layui-form-item" style="padding-left: 50%;">
    <button class="layui-btn" lay-submit="" lay-filter="saveAddCouponCode" style="width: 120px;margin-left: -60px;">保存</button>
    </div>
    </form>
    </div>

    //弹出层
    layui.layer.open({
    title: '新增券码',
    type: 1,
    area: ['600px', '420px'],//宽高
    shadeClose: true, //点击遮罩关闭
    content: $('#addCouponCode'),
    maxmin: true
    });
    0 回复
  • @jrxiang 你上面的操作真的看蒙我了,转为true之后又转为false,有什么意义。。。
    0 回复