当前位置: 首页 > article >正文

layui 自定义验证单选框必填

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

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

2. 验证规则如下

// 单选框自定义验证
        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 '必填项不能为空';
                }

 


http://www.kler.cn/a/376438.html

相关文章:

  • 什么是无限钱包系统?有什么优势?
  • 替代BD63006/罗姆应用于吸尘器⾏⾛轮、卷发器,⽔泵,⼩⻛扇等驱动芯片GC4928介绍
  • 告别繁琐统计,一键掌握微信数据
  • gitee 使用 webhoot 触发 Jenkins 自动构建
  • HTML 多媒体标签详解:<img>、<object> 与 <embed>
  • HJ36 字符串加密
  • CSS3新增边框属性(五)
  • Java基于微信小程序的私家车位共享系统(附源码,文档)
  • Vim的简单使用
  • 到底要不要用SAP Screen Personas
  • Vue中监听属性watch的求值,以及与computed的适用场景
  • 【开源免费】基于SpringBoot+Vue.J影城管理系统(JAVA毕业设计)
  • HuggingFace情感分析任务微调
  • Prompt Engineering (Prompt工程)
  • 产品定义和独开分类
  • Qt | windows视频播放器小项目
  • 基于SpringBoot的物品分类识别管理系统uniapp源码带文档教程
  • 行业深耕+全球拓展双轮驱动,用友U9 cloud加速中国制造全球布局
  • Leetcode 62. 不同路径 动态规划+空间优化
  • opengl学习-2vao和vbo(通义千问的例子)
  • macOS Sequoia 15.1 (24B83) 正式版 ISO、IPSW、PKG 下载
  • unity学习-异步场景加载
  • [论文阅读] | 智能体长期记忆
  • STM32F103的CAN通讯接收测试
  • 项目模块十二:TcpServer模块
  • 恋爱脑学Rust之dyn关键字的作用