layUI表单验证不生效的问题

简介: layUI表单验证不生效的问题

layui中使用lay-verify进行表单项的校验,但是点击提交按钮无效,校验要满足两个条件

  1. form标签需要添加 class="layui-form"
  2. 提交按钮需要添加 lay-submit=""
<form class="layui-form" action="">
    <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
</form>
<div class="layui-form" >
    <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>

注意:这个提交按钮要写在from里面。

<button class="layui-btn" lay-submit lay-filter="*">立即提交</button>


相关文章
|
前端开发 JavaScript 安全
前端框架Layui实现动态选项卡&iframe使用(附源码)
前端框架Layui实现动态选项卡&iframe使用(附源码)
2259 0
layui框架实战案例(11):表单自定义验证规则
layui框架实战案例(11):表单自定义验证规则
383 0
layui内部表单互动的实战案例:根据radio单选框自动改变input内容
layui内部表单互动的实战案例:根据radio单选框自动改变input内容
439 0
|
JavaScript
vant/vue——在van-tab中写入内容使其中间部分进行滚动
在van-tab中写入内容使其中间部分进行滚动
865 0
|
JavaScript 算法 前端开发
layui框架实战案例(16):xm-select下拉多选插件实战记录(远程搜索、过滤、翻页、单选、提示文字)
layui框架实战案例(16):xm-select下拉多选插件实战记录(远程搜索、过滤、翻页、单选、提示文字)
2930 0
|
8月前
简约404错误页面HTML源码
简约404错误页面HTML源码
309 12
|
JSON 前端开发 JavaScript
layui-数据表格的实现
`layui`是一个前端UI框架,本文档介绍了如何使用layui创建数据表格。首先展示了三张截图来预览效果,接着讲解了下载layui资源包并导入到项目中的步骤。然后,在新建的web项目中引入layui的CSS和JS文件。文档提供了模拟的JSON数据来展示表格内容。接下来,详细说明了数据表格的实现,包括注意事项和代码实现,强调了`table`标签的`id`与`script`中`elem`的匹配。此外,文档还涵盖了监听头部工具栏和工具条事件的方法,并展示了弹出层的实现,用于添加和编辑表格数据。最后,给出了完整的HTML源码示例。
487 0
|
JavaScript 前端开发
layui下拉框xm-select自定义搜索使用方法
【10月更文挑战第28天】`xm - select` 是基于 Layui 的下拉框增强插件,支持自定义搜索功能。实现步骤包括:1. 引入 Layui 和 xm - select 的核心文件;2. 创建下拉框的基本 HTML 结构;3. 使用 `layui.use` 函数初始化插件并配置搜索功能;4. 可选地进行高级自定义搜索优化,如模糊匹配、多字段搜索和实时更新数据。通过这些步骤,可实现灵活的下拉框搜索功能。
3114 1