我试图区分不同用途的keydown,keypress,keyup,input,change在JavaScript事件.
如果它是一个JavaScript自动完成搜索框,我们是否必须使用input事件处理程序?
原因是:
在change用户按Enter键或离开该输入框(通过Tab键或单击输入框外部)之前,不会调用事件处理程序,因此change当用户输入一个以上时,事件不可能符合建议的目的字符到输入框.
该keydown事件处理程序可用于击键"添加"到搜索词,但对于CTRL-V或CMD-V(在Mac上),以贴吧,我们不能真正得到keyCode一个接一个,如果我们贴上这样一句话作为hello在搜索框中-因为只有一个的keydown将是CTRL和一个的keydown的v替代,hello-但我们可以用该输入框的value属性来获取值-但是,如果有什么用户使用鼠标右键单击并选择"粘贴"以将文本添加到框中 - 在这种情况下我们应该使用,还是可以使用鼠标事件处理程序来查看value属性?处理如此低水平的键盘和鼠标太麻烦了.
因此,input事件处理程序似乎恰好符合确切的目的,因为任何值更改,input将调用事件处理程序.这就是input事件处理程序重要且有用的原因.
我们仍然需要keydown事件处理程序,因为如果用户按下向下箭头键以查看可能项目列表,该怎么办?(可能还有ESC使自动完成建议框消失).在这些情况下,不会调用input事件处理程序和change事件处理程序,并且该keydown事件对这些情况很有用.
上述概念是否正确,主要是为了理解input事件?
(了解什么事件处理程序被称为jsfiddle:http://jsfiddle.net/jYsjs/)
我对我的组件有点困惑,我需要调用onChange来支持道具
<input type="text" value={this.state.text} onChange={this.props.onChange} />
Run Code Online (Sandbox Code Playgroud)
而且还调用了调用组件中的另一个函数handleChange()来更新state.text,我试过了
<input type="text" value={this.state.text} onChange={this.props.onChange; this.handleChange} />
Run Code Online (Sandbox Code Playgroud)
但这似乎不起作用.
您如何允许input type="number"接受类似的内容,1, 2, 3, 55而不只是接受number带小数的常规内容。
我尝试使用模式,但是它似乎并没有发挥作用,因为它仍然只接受数字和小数。
Example:
<input type="number" pattern="[0-9]+([\.,][0-9]+)?">
Desired:
<input type="text" pattern="[0-9]+([\.,][0-9]+)?" value="1, 2, 3, 4">Run Code Online (Sandbox Code Playgroud)
<input type="number" pattern="[0-9]+([\.,][0-9]+)?">
Run Code Online (Sandbox Code Playgroud)