All geek questions in one place

Javascript textbox call event when value changes

I have a text field, and whenever the field value changes, I want to check and see if 20 digits have been entered.

I thought I would use the onChange event, but this seems to be interpreted as an onBlur event in IE.

So, then I thought that I would use onKeyDown, but the problem arises if the user wants to insert a value into the field, and then the function is never called.

There are no other form boxes, so I cannot rely on onBlur or expect them to change focus ever.

How to do it?

I just want to evaluate the value of the text field every time the value of the text field changes.

<input type="text" onKeyDown="myfunction()">
+4
source share
3 answers

An effective way is to use a combination of onkeydown and onpaste , which will work in IE, Firefox, Chrome and Safari. Opera is weird here because it does not support onpaste , so you may need to return to onchange for Opera or use the DOMAttrModified mutation DOMAttrModified , see the example below.

Internet Explorer also supports onpropertychange , which will be triggered every time an element property changes, including value . I read that DOMAttrModified supported by Opera and Safari (not sure about Firefox), so you can use this in conjunction with IE onpropertychange (untested):

 if ("implementation" in document && document.implementation.hasFeature('MutationEvents','2.0')) myInput.addEventListener("DOMAttrModified", valueChanged, false); else if ("onpropertychange" in myInput) myInput.onpropertychange = valueChanged; function valueChanged (evt) { var attr; evt = evt || window.event; attr = evt.attrName || evt.propertyName; if (attr == "value") validate(); }
+10
source

use onKeryPress event

  <input type="text" onKeyDown="CountText(this,200)" onpaste="return false;"> function CountText(field, maxlimit) { if (field.value.length < maxlimit) // if too long...trim it! { return true; } else return false; }

check out my full article at: http://www.codeproject.com/KB/validation/MyTextBox.aspx

0
source 
  <script> function multy(val) { alert(val.value+"--"+val.id); } </script> </head> <body> <input id="txtdemo" type="text" onchange="multy(this);"></br> <input id="txtdemo" type="text" onchange="multy(this);"> </input> </body>

Click to view the input screen.

Thanks...:)

0
source

Source: https://habr.com/ru/post/1309694/

More articles:


All Articles