Layer弹出层闪退

使用layui踩过的1、2、3、4、5、6、7、8、9……次坑

问题:
  • 将Layui的数据表格放到from表单中,数据表格中的按钮(弹出弹出层)点击后弹出层闪退 。。。
分析:
  • 一开始以为Layui的数据表格可能和form表单有冲突,或者弹出层哪里设置不对,但是仔细检查发现没有写错,抱着试试的心态将数据表格和从前一样放到form表单的外面,发现居然可以用了!
  • 后来发现原来我复制过来数据表格的代码中使用的是<button></button>标签(之前form和数据表格是分离的),点击的时候会触发默认事件,而form的action我没填,所以就是弹出层闪退……
解决方法:
  • 将数据表格中的<button></button>标签全部换成<a></a>标签
  • 修改先
    <form class="layui-form layui-form-pane" action="">
    	<div class="layui-form-item">
    		<div class="layui-inline">
    			<!-- xxxxxxxxxx -->
    		</div>
    		<div class="layui-inline">
    			<!-- xxxxxxxxxx -->
    		</div>
    			
    		<!--layui数据表格-->
    		<table class="layui-hide" id="teamTableId" lay-filter="teamTableFilter"></table>
    		
    		<div class="layui-inline">
    			<!-- xxxxxxxxxx -->
    		</div>
    		<div class="layui-form-item" style="position: relative; left: 498px;">
    			<button class="layui-btn" lay-submit="" lay-filter="form">提交</button>
    			<button type="reset" class="layui-btn layui-btn-primary">重置</button>
    		</div>
    	</div>
    </form>
    <!--表格头部-->
    <script type="text/html" id="tablebar">
    	<div class="layui-btn-group layui-inline">
    		<button id="addstudent" class="layui-btn layui-btn-normal data-add-btn" data-method="addstudent">添加</button >
    	</div>
    </script>
    <!--自定义的列模板-->
    <script type="text/html" id="currentTableBar">
    	<button class="layui-btn layui-btn-xs data-count-edit" data-method="modifystudent" lay-event="edit"><修改</button >
    	<button class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</button >
    </script>
    
  • 修改后
    <!-- xxxxxxxxxx -->
    
    <!--表格头部-->
    <script type="text/html" id="tablebar">
    	<div class="layui-btn-group layui-inline">
    		<a id="addstudent" class="layui-btn layui-btn-normal data-add-btn" data-method="addstudent">添加</a>
    	</div>
    </script>
    <!--自定义的列模板-->
    <script type="text/html" id="currentTableBar">
    	<a class="layui-btn layui-btn-xs data-count-edit" data-method="modifystudent" lay-event="edit"><修改</a>
    	<a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
    </script>
    
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值