Javascript 如何在 React.js 中正确捕获文本输入的 change/focusOut 事件?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/37609049/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to correctly catch change/focusOut event on text input in React.js?
提问by Alexey Suslyakov
I've got a form, in which I want to handle changeevent on text inputs, but React onChangetriggering on key down(opposite to native JS, that triggers changeevent when an input field is out of focus).
我有一个表单,我想在其中处理文本输入上的更改事件,但是响应onChange在按下键时触发(与本机 JS 相反,当输入字段失去焦点时触发更改事件)。
Is there a React wayto do what I want?
有反应的方式来做我想做的事吗?
回答by Dominic
回答by jossie
Its late, yet it worth your time noting that, there is some difference in browser level implementation of focusin and focusout events and react synthetic onFocus and onBlur. focusin and focusout actually bubble, while onFocus and onBlur dont. So there is no exact same implementation for focusin and focusout as of now for react. Anyway most cases will be covered in onFocus and onBlur.
很晚了,但值得注意的是,在浏览器级别的 focusin 和 focusout 事件和反应合成 onFocus 和 onBlur 方面存在一些差异。focusin 和 focusout 实际上是冒泡的,而 onFocus 和 onBlur 则没有。因此,目前对于 react 而言,focusin 和 focusout 没有完全相同的实现。无论如何,onFocus 和 onBlur 将涵盖大多数情况。
回答by kahlan88
You'd need to be careful as onBlur
has some caveats in IE11 (How to use relatedTarget (or equivalent) in IE?, https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/relatedTarget).
您需要小心,因为onBlur
IE11 中有一些警告(如何在 IE 中使用 relatedTarget(或等效对象)?,https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/relatedTarget) .
There is, however, no way to use onFocusOut
in React as far as I can tell. See the issue on their github https://github.com/facebook/react/issues/6410if you need more information.
然而,onFocusOut
据我所知,没有办法在 React 中使用。如果您需要更多信息,请参阅他们的 github https://github.com/facebook/react/issues/6410上的问题。