layui 自定义验证单选框必填

news2024/11/27 6:39:08

对于输入框类型必填验证,只需要在 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.coloradmin.cn/o/2231828.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

植物神经紊乱别担心,这些运动让你重拾健康与平衡✨

在这个快节奏、高压力的时代,植物神经紊乱似乎已经成为现代人的“隐形杀手”。焦虑、失眠、心跳过速、呼吸不规律……这些症状不仅影响了我们的日常生活,更在无声中侵蚀着我们的身心健康。但别担心,通过科学合理的运动,我们可以有…

第1篇 引言

一、AIGC概念 1、AIGC定义 AIGC,即生成式人工智能(Artificial Intelligence Generated Content),是指利用人工智能技术自动生成或辅助创作内容的过程和结果。 简单来说:过去,写文章、画张图、唱首歌、弄个…

2. 从服务器的主接口入手

Webserver 的主函数 main.cpp,完成了哪些功能? #include "config.h"int main(int argc, char *argv[]) {string user "";string passwd "";string databasename "";Config config;config.parse_arg(argc, a…

向量数据库 PieCloudVector 进阶系列丨打造音乐推荐系统

在上一篇内容中,我们介绍了 PieCloudVector 如何助力构建基于图片数据的商品推荐系统,详细描述从数据集的准备到数据向量化处理,再到向量数据的存储和相似性搜索的完整流程。本文将进一步探讨如何将 PieCloudVector 应用于音频数据&#xff0…

python之数据结构与算法(数据结构篇)-- 栈

一、栈的概念 这里我们不去了解教科书上面的“教条概念”,其实“栈”的概念和古代的时候的“客栈”是有异曲同工之妙的。 在这里我们把客栈看成“栈”,旅客看作“栈元素” 1.当旅客进来住店时,叫做“入栈”; 2.当旅客退房时&#…

Java调用chatgpt

目前openai的chatgpt在国内使用有一定难度,不过国内的大模型在大部分情况下已经不弱于chatgpt,而且还更便宜,又能解决国内最敏感的内容安全问题。本文后续以spring ai调用国内chatgpt厂商实现为例,讲解怎么构建一个java调用chatgp…

web前端多媒体标签设置(图片,视频,音频)以及图片热区(usemap)的设置

多媒体标签运用 在HTML中有以下常见多媒体标签&#xff1a; <img> &#xff08;图像标签&#xff09; - 作用&#xff1a;用于在网页中嵌入图像。 - 示例&#xff1a; <img src"image.jpg" alt"这是一张图片"> 。其中 src 属性指定图像的…

安卓开发之数据库的创建与删除

目录 前言&#xff1a;基础夯实&#xff1a;数据库的创建数据库的删除注意事项 效果展示&#xff1a;遇到问题&#xff1a;如何在虚拟机里面找到这个文件首先&#xff0c;找到虚拟机文件的位置其次&#xff0c;找到数据库文件的位置 核心代码&#xff1a; 前言&#xff1a; 安…

基于SSM+微信小程序的订餐管理系统(点餐2)

&#x1f449;文末查看项目功能视频演示获取源码sql脚本视频导入教程视频 1、项目介绍 基于SSM微信小程序的订餐管理系统实现了管理员和用户。管理端实现了 首页、个人中心、用户管理、菜品分类管理、菜品信息管理、订单信息管理、配送信息管理、菜品评价管理、订单投诉管理、…

《AI在企业战略中的关键地位:以微软和阿里为例》

内容概要 在当今商业环境中&#xff0c;人工智能&#xff08;AI&#xff09;的影响力如滔滔洪水&#xff0c;愈演愈烈。文章将揭示AI在企业战略中的崛起&#xff0c;尤其以微软和阿里巴巴为代表的企业&#xff0c;这两家科技巨头通过不同方式&#xff0c;将智能技术融入其核心…

华为荣耀曲面屏手机下面空白部分设置颜色的方法

荣耀部分机型下面有一块空白区域&#xff0c;如下图红框部分 设置这部分的颜色需要在themes.xml里面设置navigationBarColor属性 <item name"android:navigationBarColor">android:color/white</item>

【ESP32】ESP-IDF开发 | I2C从机接收i2c_slave_receive函数的BUG导致程序崩溃解决(idf-v5.3.1版本)

1. 问题 在调试I2C外设的demo时&#xff0c;按照官方文档的描述调用相关API&#xff0c;烧录程序后发现程序会不断崩溃&#xff0c;系统log如下。 初步分析log&#xff0c;原因是访问到了不存在的地址。一开始我以为是自己的代码问题&#xff0c;反反复复改了几次都会出现同样的…

企业数字化转型实施中的挑战与解决方案:架构引领的战略路径

在企业推动数字化转型的过程中&#xff0c;通常会面临复杂的挑战。随着技术的不断演进和业务环境的变化&#xff0c;企业架构&#xff08;Enterprise Architecture, EA&#xff09;成为帮助企业应对这些挑战的关键工具。通过提供一个全面的战略蓝图&#xff0c;EA使企业能够在保…

桑基图在医学数据分析中的更复杂应用示例

桑基图&#xff08;Sankey Diagram&#xff09;能够有效地展示复杂的流动关系&#xff0c;特别适合用于医学数据分析中的多种转归和治疗路径的可视化。接下来&#xff0c;我们将构建一个稍微复杂的示例&#xff0c;展示不同疾病患者在治疗过程中的流动&#xff0c;以及他们的治…

[SICTF Round4] PWN

这PWN题似乎是给我出的&#xff0c;4个一血1个2血。密码又过于简单。逆向太难了又不大会。 Stack fengshui main可以溢出覆盖rbpret所以它每一步都需要移栈。 可用的ROP里没有pop rdi,在4004c0里有错位的01 5d c3 &#xff1a;add DWORD PTR [rbp-0x3d], ebx 并且有对应的p…

消息中间件类型介绍

ActiveMQ&#xff1a; ActiveMQ可是个老将了&#xff0c;它功能全面、稳定可靠&#xff0c;还支持多种协议和编程语言。如果你需要一个兼容性好、易于集成的消息中间件&#xff0c;ActiveMQ可是个不错的选择。 RabbitMQ&#xff1a; RabbitMQ以其简单易用和高性能著称。它支持丰…

【设计模式系列】组合模式(十二)

目录 一、什么是组合模式 二、组合模式的角色 三、组合模式的典型应用 四、组合模式在Mybatis SqlNode中的应用 4.1 XML映射文件案例 4.2 Java代码使用案例 一、什么是组合模式 组合模式&#xff08;Composite Pattern&#xff09;是一种结构型设计模式&#xff0c;其核…

Ghidra无头模式(自动化批处理执行重复性任务)

Ghidra无头模式&#xff08;自动化批处理执行重复性任务&#xff09; 与Ghidra GUI探索单个项目中的单个文件不同&#xff0c;Ghidra headless analyzer&#xff08;Ghidra无头分析器&#xff09;更加适合批处理和用脚本控制Ghidra。 &#xff08;一&#xff09;启动analyzeHea…

【大众点评】店铺评论 加密参数生成逆向分析

点击好评 https://www.dianping.com/ajax/json/shopDynamic/allReview 分析参数_token 直接搜_token 共17个&#xff0c;优先看和请求相关的 给第一个_token打上断点&#xff0c;然后切换评论&#xff0c;就直接断住了 n h(i, e.sendData) _token: n 现在给它打上断点&am…

Fsm3

采用读热码编写方式&#xff1a; module top_module(input clk,input in,input areset,output out); ////reg [3:0]A 4d0001;// reg [3:0]B 4d0010;//reg [3:0]C 4d0100;// reg [3:0]D 4d1000; //1、首先用读热码定义四个状态变量parameter A 4d0001 ,B 4d0010, C 4d01…