layui 表单提交
新手小白,使用layui的时候,表单如何像普通表单那样提交呢?
如下:只需要在回调函数里 返回true,并且在form表单正常添加 action 和 method 属性就行!
如果返回false;将会拦截 阻止默认 form 跳转,此时可以在函数里通过 ajax 进行数据交互
<form class="layui-form" action="${basepath}/charpter07/logion" method="post"> <div class="demo-login-container"> <div class="layui-form-item"> <div class="layui-input-wrap"> <div class="layui-input-prefix"> <i class="layui-icon layui-icon-username"></i> </div> <input type="text" name="username" value="" lay-verify="required" placeholder="用户名" lay-reqtext="请填写用户名" autocomplete="off" class="layui-input" lay-affix="clear"> </div> </div> <div class="layui-form-item"> <div class="layui-input-wrap"> <div class="layui-input-prefix"> <i class="layui-icon layui-icon-password"></i> </div> <input type="password" name="password" value="" lay-verify="required" placeholder="密 码" lay-reqtext="请填写密码" autocomplete="off" class="layui-input" lay-affix="eye"> </div> </div> <div class="layui-form-item"> <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="demo-login">登录</button> </div> </div> </form> <script> layui.use(function () { var form = layui.form; var layer = layui.layer; // 提交事件 form.on('submit(demo-login)', function (data) { return true; // 返回false 阻止默认 form 跳转 }); }); </script>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!