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)

相关推荐
秋水无痕13 分钟前
# 手把手教你从零搭建 AI 对话系统 - React + Spring Boot 实战(一)
前端·后端
高桥凉介发量惊人15 分钟前
基础与工程篇-多环境配置(dev/test/prod)与打包策略
前端
墨鱼笔记16 分钟前
前端必看:Vite.config.js 最全配置指南 + 实战案例
前端·vite
kyriewen17 分钟前
异步编程:从“回调地狱”到“async/await”的救赎之路
前端·javascript·面试
前端Hardy20 分钟前
别再手动写 loading 了!封装一个自动防重提交的 Hook
前端·javascript·vue.js
前端Hardy21 分钟前
前端如何实现“无感刷新”Token?90% 的人都做错了
前端·javascript·vue.js
秋水无痕22 分钟前
# 手把手教你从零搭建 AI 对话系统 - React + Spring Boot 实战(二)
前端·后端·面试
SuperEugene30 分钟前
Vue Router 实战规范:path/name/meta 配置 + 动态 / 嵌套路由,统一团队标准|状态管理与路由规范篇
开发语言·前端·javascript·vue.js·前端框架
小彭努力中1 小时前
194.Vue3 + OpenLayers 实战:动态位置 + 高度 + 角度,模拟卫星地面覆盖范围
前端·css·vue.js·openlayers·animate
颜正义1 小时前
作为前端你还不会 Playwright 进行单元测试吗?
前端·测试