请考虑以下演示
https://stackblitz.com/edit/angular-pur1dt
我有反应式表单控件,同步验证程序和错误消息显示在字段下面无效时.
当控制失去焦点时,将触发验证.控件下方有一个带有点击处理程序的按钮.问题是,当我单击按钮时,控件失去焦点,验证发生,显示错误消息并向下移动按钮.据说这可以防止点击处理程序执行.任何建议为什么会发生这种情况以及如何解决问题？
解决方法
该问题似乎与触发订单的DOM事件有关
据MDN称：
The click event is fired when a pointing device button (usually a
mouse’s primary button) is pressed and released on a single element.
https://developer.mozilla.org/en-US/docs/Web/Events/click
在给定的示例中,元素会在您模糊输入的那一刻移动 – 因为验证会立即发生,显示错误并重新定位按钮.
因此,鼠标在按钮上方时会关闭,但是当它向上时 – 按钮会重新定位.所以点击不会在按钮上触发
>在mousedown延迟错误揭示
>隐藏错误,直到mousedown和mouseup都发生,如果mousedown发生在按钮上
>等
这是mousedown事件处理的一个例子
https://jsfiddle.net/gjbgqqpo/
希望这可以帮助 ：)
