layui表单验证之单选框

今天在做项目的过程中发现了涉及到表单验证的问题,尤其是radio元素和checkbox元素。像radio和checkbox这类特殊的表单元素,需要单独添加验证规则以改变其样式,现在我的需求是点击提交按钮验证radio或checkbox时,要实现如下图的必填样式:


以radio为例

且,在鼠标移出时也要保持标红状态,在选中radio选项时才恢复,既然这样,我参考了网上童靴们给的解决方案:


关键代码

上图代码中我去掉了radio失去焦点时取消标红状态的部分,使其保持标红状态,并,结合自己的需求,在form.on('radio')中,进行了颜色的改变:
监听radio选中

以上,就OK了,checkbox则同理。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。