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 '必填项不能为空';
    }

相关推荐
别惊醒渔人3 分钟前
Vue3 Diff 优化:最长递增子序列 LIS
前端·javascript·vue.js
颜酱17 分钟前
07 | 把字段与指标同步到 Qdrant(生成阶段)
前端·人工智能·后端
用户0595401744622 分钟前
把AI长期记忆测试从手动验证换成pytest,2天揪出11个隐藏Bug
前端·css
Larcher36 分钟前
从“加载模型”界面到端侧推理:拆解一个 React + WebGPU 大模型 Demo
javascript·后端
Larcher1 小时前
从状态快照到惰性初始化:读懂 React useState 的三个关键场景
javascript·人工智能·后端
lichenyang4531 小时前
从 Vite 空项目到 AIGC 图片工作台:我如何打通生图、任务轮询、生成库与 Canvas 动态特效
前端·人工智能
泡沫冰@2 小时前
上章节中文件的讲解
前端·网络·nginx
进击的丸子2 小时前
APP人脸识别增值版Harmony Demo实操与关键代码解析
前端·程序员·harmonyos
a1117762 小时前
唯美花朵风格的黑胶唱片音乐播放器
前端·css·css3
Hilaku3 小时前
工作 5 年后,决定你薪资上限的究竟是什么?
前端·javascript·程序员