css实现原生form表单label必填选项红色*样式,以及js控制必填校验

文章目录

一、css实现原生form表单label必填选项红色*样式,以及js控制必填校验?

二、实现方案

1.css实现原生form表单label必填选项红色*样式代码如下(示例):

javascript 复制代码
 <div class="isCross comItem" required>
     <label for="isCross">是否涉及跨境业务:</label>
     <div class="content">
          <div>
              <input type="radio" name="isCross" />
              <span>是</span>
          </div>
    </div>
     <div>
          <input type="radio" name="isCross" />
          <span>否</span>
     </div>
</div>

.comItem[required="required"] label:before {
    color: red;
    content: "*";
    position: absolute;
    margin-left: -15px;
}

js控制必填校验
参考原文

bootstrap:表单必填项*标识,及提交前校验 - 秋寻草 - 博客园 (cnblogs.com)

相关推荐
极梦网络无忧23 分钟前
基于 Vite + Vue3 的组件自动注册功能
前端·javascript·vue.js
Predestination王瀞潞36 分钟前
5.4.3 通信->WWW万维网内容访问标准(W3C):WWW(World Wide Web) 协议架构(分层)
前端·网络·网络协议·架构·www
爱学习的程序媛1 小时前
【Web前端】优化Core Web Vitals提升用户体验
前端·ui·web·ux·用户体验
zabr1 小时前
花了 100+ 篇笔记,我整理出 了一套 AI Agent 工程完全指南
前端·后端·agent
软弹1 小时前
深入理解 React Ref 机制:useRef 与 forwardRef 的协作原理
前端·javascript·react.js
YaHuiLiang1 小时前
Ai Coding浪潮下的前端:“AI在左,裁员在右”
前端
雪碧聊技术1 小时前
前端vue代码架子搭建
前端·javascript·vue.js·前端项目代码框架搭建
爱学习的程序媛1 小时前
【Web前端】前端用户体验优化全攻略
前端·ui·交互·web·ux·用户体验
han_1 小时前
JavaScript设计模式(二):策略模式实现与应用
前端·javascript·设计模式
x***r1511 小时前
Notepad++ 8.6 安装教程:详细步骤+自定义安装路径(附注意事项)
linux·前端·javascript