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

element 表单校验失败定位到指定元素

 this.$refs.generateForm.validate(valid => {if (valid) {} else {console.log('表单数据校验失败')this.moveToErr()}

  

moveToErr() {this.$nextTick(() => {let isError = document.getElementsByClassName('is-error')if (isError.length > 0) {const firstError = isError[0];// 检查元素及其子元素是否可获取焦点const focusableElements = firstError.querySelectorAll('input, button, select, textarea, [tabindex]:not([tabindex="-1"])');const hasFocusableChild = focusableElements.length > 0;// 平滑滚动到错误元素firstError.scrollIntoView({behavior: 'smooth',block: 'center'});// 如果有可聚焦子元素则聚焦第一个if (hasFocusableChild) {focusableElements[0].focus();} else {console.log('没有可以聚焦的元素', firstError);}}})},

  

http://www.hskmm.com/?act=detail&tid=34984

相关文章:

  • 2025年湖北武汉实验室设计哪家口碑好/哪家信誉好/哪家售后好?
  • 国产化Word处理控件Spire.Doc教程:用Java实现TXT文本与Word互转的完整教程
  • C# Avalonia 16- Animation- BombDropper
  • 2025年太阳能板定制厂家可靠推荐与排行榜
  • 实验室改造推荐厂家/实验室设计供应商推荐/实验室装修找哪个?
  • 2025年太阳能板定制厂家口碑排行榜单:权威推荐与选择指南
  • 2025年太阳能板定制厂家口碑排行榜前十强:专业评测与选择指南
  • 2025年AI搜索优化品牌推荐排行榜前十强深度解析
  • 2025年AI搜索优化品牌推荐排行榜:技术深度解析与选择指南
  • 2025年AI搜索优化品牌排行榜前十强权威发布
  • 直播回顾|PostgreSQL 18 六大新特性深度解析
  • win10 开启大小核心调度--异类策略0~4介绍
  • 异常----Windows 已保护你的电脑:Microsoft Defender SmartScreen 阻止了无法识别的应用启动。运行此应用可能会导致你的电脑存在风险。
  • 把“扔硬币”搬到互联网:一文看懂 AB 测试的底层逻辑 - 指南
  • 记录下,cadence17.4 PCB封装更新方法
  • springboot使用aop切面,记录日志
  • 【整活】OI的那些奇妙小操作(Part 1)
  • 想学习的数学
  • qzmoot 生活合集
  • OO之接口-DAO模式代码阅读及应用
  • 个微协议,微信号二次开发/ipad协议
  • Win11设置默认打开全部右键菜单
  • 发现概率
  • 微信机器人开发API!3步搞定微信聊天机器人
  • yocto工程升级要点
  • windows2019的域控服务器更新时间.251020
  • 国内DOH解析速度测试(阿里 腾讯 360 Doh测速)
  • WatchAlert 轻量级AI日志告警 - Docker安装部署
  • 对话智能体泛化研究在线挑战启动
  • 2025.10.20