layui 自定义验证单选框必填

对于输入框类型必填验证,只需要在 input 输入框加入 lay-verify = "required" 即可。但对于单选按钮这种特殊的该怎么办呢?layui 为我们提供了自定义验证。

  1. 在单选按钮上添加自定义验证的名称
  1. 验证规则如下

    // 单选框自定义验证
    form.verify({
    radioVerify: function(value, item){ //value:表单的值、item:表单的DOM对象
    var = layui.;
    var verifyName = (item).attr('name') ,verifyType = (item).attr('type')
    ,formElem = $(item).parents('.layui-form') //获取当前所在的form元素,如果存在的话
    ,verifyElem = formElem.find("input[name='"+verifyName+"']")//获取需要校验的元素
    ,isTrue = verifyElem.is(':checked')//是否命中校验
    ,focusElem = verifyElem.next().find('i.layui-icon');//焦点元素
    if(!isTrue || !value){
    //定位焦点
    focusElem.css(verifyType=='radio'?{"color":"#FF5722"}:{"border-color":"#FF5722"});
    //对非输入框设置焦点
    focusElem.first().attr("tabIndex", "1").css("outline", "0").blur(function() {
    focusElem.css(verifyType=='radio'?{"color":""}:{"border-color":""});
    }).focus();
    return '必填项不能为空';
    }

相关推荐
gis开发之家9 分钟前
《Vue3 从入门到大神50篇》Vue3 源码详解(二十):生命周期钩子源码解析 —— onMounted / onUpdated 如何实现?
前端·javascript·前端框架·vue3·vue3源码
全栈项目管理程序猿12 分钟前
ArcGIS JS 基础教程(9):天空盒与大气效果
javascript
Narrastory12 分钟前
我用 Claude Code 写代码不到 2 小时,却花了 3 天做完这个软件—Vibe Coding 的正确姿势,是设计不是生成
前端·人工智能·github
Enaium13 分钟前
我实现了KMP的SDL绑定并编写了高性能软光追
前端·kotlin
古夕18 分钟前
本地正常线上白屏:一次路由切换后刷新恢复问题的排查与修复
前端·ai编程
栀鸢ouo25 分钟前
解决Element Plus表格展开行横向溢出、滚动截断问题(项目实战方案)
前端·vue.js
用户390513321928829 分钟前
写了5年JS,才发现这10个方法能少写一半代码
前端
平凡的阿泽29 分钟前
我用TRAE Work手搓了一个「谁是卧底」小游戏
前端·javascript
Highcharts31 分钟前
Highcharts 实战:基于 Gauge 仪表盘打造实时动态时钟可视化开发全解析
javascript·数据可视化
一心只读圣贤书38 分钟前
AI 辅助前端视觉回归治理:从截图基线到变更解释
前端·人工智能