简体   繁体   English

用户将数据输入表单时要知道什么事件?

[英]What event to know when user has entered data into form?

I have a HTML form. 我有一个HTML表单。 I want to enable/disable a button until user eneters text in one of the fields. 我想启用/禁用按钮,直到用户在其中一个字段中输入文字。 I am adding an event attribute to the which triggers some javascript. 我向触发了一些JavaScript的事件属性。 This javascript will enable/disable the button. 此javascript将启用/禁用按钮。 Problem is I can't figure out what event attribute to use. 问题是我不知道要使用哪个事件属性。 What event attribute please will trigger as soon as user enters data? 用户输入数据后,将触发什么事件属性? I tried onchange but that only gets called when i clicked back outside the text area. 我尝试了onchange,但是只有在我在文本区域之外单击时才调用它。 So it may aswell be onblur. 因此它可能是模糊的。

You can use the input 您可以使用input

function activateForm (event) {
    if(!this.value == ""){ 

    }
}
var input = document.querySelector(".myInput");

input.addEventListener("input", activateForm , false)

There are 2 possible events that can be used: either onChange or onKeyPress . 可以使用两种可能的事件: onChangeonKeyPress onChange will trigger when the value of an input has changed while onKeyPress will trigger every time the user types something in a text box. 当输入值更改时, onChange将触发,而每次用户在文本框中键入内容时, onKeyPress将触发。 The onChange triggers once the user has CHANGED something in the value, and got out of the input focus. 一旦用户更改了值中的某些内容并脱离了输入焦点,onChange就会触发。 That means the user has to hit TAB or click somewhere else for the event to trigger, hence why onKeyPress might be better suited. 这意味着用户必须单击TAB或单击其他位置才能触发事件,因此为什么onKeyPress可能更适合。

Read more: 阅读更多:

http://www.w3schools.com/jsref/event_onchange.asp http://www.w3schools.com/jsref/event_onkeypress.asp http://www.w3schools.com/jsref/event_onchange.asp http://www.w3schools.com/jsref/event_onkeypress.asp

Younger browsers also support onInput which should certainly be prefered for now, if you do not need to support older browsers. 较年轻的浏览器还支持onInput ,如果您不需要支持较旧的浏览器,那么现在肯定应该首选onInput

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何检查用户是否尚未将数据输入表单(用于发送)? - How to check if the user has not entered the data to a form (befor sending)? 如何知道用户是否输入了无效的$ routeparams - How to know if user has entered invalid $routeparams 了解何时提交 iFrame 中的表单的事件 - Event to know when a form in an iFrame has been submitted 知道用户何时在表单上进行更改的Javascript事件 - Javascript event to know when a user changes something on a form DOJO表格FilteringSelect允许用户输入数据 - DOJO form FilteringSelect allow user entered data 如何在模式中使用从 handleSubmit 函数返回的数据来显示用户输入的内容? - How do I use the data returned from a handleSubmit function in a modal to display what the user has entered? Angular.js-在重定向期间保留输入的表单数据,以便用户在返回该表单时继续 - Angularjs - Retain the entered form data during redirection for the user to continue when coming back to that form 如何计算用户在文本表单中输入的特定符号的数量 - How to count the amount of specifc symbols that a user has entered in a text form 如何显示确认提示,显示当用户在文本字段中输入信息并单击js中的“提交”时输入的内容 - How to display an acknowledgement prompt showing what has been entered when user inputs info into text fields and clicks submit in js 如何确定用户何时正式离开或进入页面 - How to determine when a user has officially left or entered a page
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM