Angular4 失焦与点击冲突处理

Angular4 处理鼠标失去焦点事件与Button按钮点击事件的冲突
问题：
注册界面中Input输入不符合验证格式时失去焦点需要弹出提示框，每个Input输入错误时都需要弹提示框，输入为空的提示框时最后点击提交按钮时弹出提示框，这样导致，input最后一个输入验证不符合格式要求时弹出的提示框与输入为空的弹出提示框同时出现。
解决方法：
经过不断的查询与验证找到解决方法，使用鼠标事件mousedown方法。在添加button按钮事件同时添加鼠标 mousedown，由于mousedown方法会先于button事件执行，重置焦点，解决提示框同时弹出问题。
例如：<button (click)=“regSubmit()” (mousedown)=“loseFocus()”>注册

Angular4 失焦与点击冲突处理相关推荐

RecyclerView父组件和子组件点击冲突问题解决
嘛嘛...遇到的问题是这样的,我仿照微信的长按点击显示放大文本效果对TextView(定制)设置了长按点击事件,然后在RecyclerView中使用了这个组件,然后对RecyclerView的每一个i ...
处理Android中的点击冲突
我目前遇到的点击冲突发生的情况有三种: 1.ViewGroup中Item点击事件和子控件的冲突: 2.onTouch与onClick之间的冲突: 3.滑动与点击事件冲突. 下面开始分享解决办法: 情况 ...
使用better-scroll无法进行无缝切换的原因与自动播放的冲突、与fastclick的点击冲突
原因是版本更新,之前的写法是: this.slider = new BScroll(this.$refs.slider, {scrollX: true,scrollY: false,momentum: ...
解决element-ui中表格行点击事件和表格单元格点击事件冲突的问题
element-ui中如果同时设置了表格行点击事件和表格单元格点击事件的化,当点击单元格的时候会因为事件冒泡触发表格行点击事件,这不是我们需要的要解决这种事件冲突的问题,只需要在单元格的点击事件上加 ...
Git应用之eclipse解决冲突代码
最近上班公司框架换成了微服务下面是eclipse 对代码进行管理 1.冲突代码如果两个人在一个项目上同一文件上更改代码就会出现冲突现象先用NewFile.jsp 文件做演示打开eclipse从 ...
iOS-关于一些手势冲突问题（scrollView 嵌套 tableView）
简单说下关于开发中容易遇到的父试图添加手势与子试图点击事件冲突,UIScrollView 嵌套 UIScrollView . UIScrollView 嵌套 UITableView的情况手势冲突问题: ...
maven依赖冲突以及解决方法
查看依赖冲突 # 通过dependency:tree是命令来检查版本冲突 mvn -Dverbose dependency:tree 其中omitted for duplicate表示有jar包被重复 ...
多个输入框失焦事件触发异常问题解决
项目场景: 表单校验,包含多个输入框,需要对每个输入框进行失焦校验,校验不通过需要进行弹框提示用户. 问题描述点击A输入框->再点击B输入框->触发A失焦弹窗->点击弹窗确认-&g ...
详述使用 IntelliJ IDEA 解决 jar 包冲突的问题
在实际的 Maven 项目开发中,由于项目引入的依赖过多,遇到 jar 冲突算是一个很常见的问题了.在本文中,我们就一起来看看,如何使用 IntelliJ IDEA 解决 jar 包冲突的问题!简单粗 ...

Angular4 失焦与点击冲突处理

Angular4 失焦与点击冲突处理相关推荐

最新文章

热门文章