Question

178

Javascript textbox call event when value changes

rated 0 times [ 179] [ 1] / answers: 1 / hits: 26816 / 14 Years ago, thu, may 13, 2010, 12:00:00

I have a textbox, and whenever the value of the box changes, I want to check and see if 20 digits have been entered.

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

So then I thought I would use onKeyDown, but the problem comes in if the user wants to paste a value into the field, then the function never gets called.

There are no other form boxes so I can't rely on onBlur or expect that they will change focus ever.

How do I do this?

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

<input type="text" onKeyDown="myfunction()">

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

soniap

Add To Favorites

Follow

Total Points: 626

Total Questions: 119

Total Answers: 110

Location: Palestine

Member since Tue, Jul 20, 2021

3 Years ago

answered 14 Years ago tomas · Accepted Answer

An effective way is to use a combination of onkeydown and onpaste, which will work in IE, Firefox, Chrome and Safari. Opera is the odd one out here because it doesn't support onpaste so you may have to fall back to onchange for Opera or use the DOMAttrModified mutation event, see example below.

Internet Explorer also supports onpropertychange, which will fire every time a property changes on an element -- including value. I have read that DOMAttrModified is supported by Opera and Safari (not sure about Firefox), so you could use that in combination with IE's 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();

}