jquery .on('input') doesn't get fired in ie8 alone

Question

I'm having this issue specific to IE8. This event doesn't fire in IE8 alone, but is working fine in IE9 and other browsers like Firefox and Chrome.

$('#myId').on('input', function () {
   //do something.
}

Please let me know if there is any work around for the same in IE8.

Thanks!

I don't recognize "input" as an event trigger, myself. Maybe I've just never seen it? — VoidKing, Oct 03 '13 at 13:47
Try using `change` or `keyup` instead, `input` isn't supported in older browsers. — Joe, Oct 03 '13 at 13:48
@VoidKing and everyone that upvoted your comment: Learn about it: [MDN oninput](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers.oninput) — epascarello, Oct 03 '13 at 13:48
On a side note make sure you aren't using jquery 2.0+ it doesn't support old IE versions. — Patsy Issa, Oct 03 '13 at 13:49
keyup works fine. change works only the textbox looses focus. thanks — user2721870, Oct 03 '13 at 14:04
possible duplicate of [How to detect when a text input changes with ie8](http://stackoverflow.com/questions/11791855/how-to-detect-when-a-text-input-changes-with-ie8) — Daan, Feb 27 '14 at 12:31

score 27 · Answer 1 · answered Oct 14 '14 at 14:58

27

Older versions of IE have an event called propertychange that you can use. You can check for the propertychange event and the input event at the same time:

$('#myId').on("propertychange input",function(ev){
    doAwesomeThing();
});

answered Oct 14 '14 at 14:58

AaronBaker

1,013
11
15

2

Works but fires property change event twice in IE8 ... used `'keyup input'` instead and it worked! – Justin Mar 11 '15 at 20:54
Confirmed, Justin's solution above works like a charm. Thanks! – scuds Apr 08 '15 at 14:09

score 8 · Accepted Answer · edited Oct 14 '13 at 15:07

8

oninput is IE9+, that is why it does not work in IE8

MDN oninput

Feature         Chrome    Firefox    Internet Explorer    Opera    Safari
Basic support   (Yes)     2          9                    10       (Yes)

edited Oct 14 '13 at 15:07

gen_Eric

223,194
41
299
337

answered Oct 03 '13 at 13:50

epascarello

204,599
20
195
236

Note that IE9 also doesn't support `oninput` well, see https://stackoverflow.com/questions/6382389/oninput-in-ie9-doesnt-fire-when-we-hit-backspace-del-do-cut – John29 Sep 25 '18 at 15:35

score 5 · Answer 3 · answered Jan 19 '15 at 21:19

5

AaronBaker's answer: Works for both IE8 and IE10(html5) as well as modern browsers... without double post of event

I would have used comment or upvote but rep too low.

$('#myId').on("propertychange input",function(ev){
    doAwesomeThing();
});

answered Jan 19 '15 at 21:19

Richard Dufour

71
1
4

score 1 · Answer 4 · answered Oct 03 '13 at 13:51

1

It looks like the input event is a part of the HTML5 specification, something I wouldn't expect IE8 to handle. You may need to use the change event instead.

answered Oct 03 '13 at 13:51

villecoder

13,323
2
33
52

score 1 · Answer 5 · answered Apr 22 '15 at 21:22

1

This slight optimization will prevent the listener from firing twice in modern browsers (kind of a hack, but prob the best solution)

$('selector').on(!window.eventListener ? 'keyup' : 'input', function () {}

answered Apr 22 '15 at 21:22

Neil Taylor

31
2

score 0 · Answer 6 · answered Oct 04 '18 at 17:04

I tried using propertychange as suggested by the top answer, but I noticed that sometimes it doesn't fire in IE8. For example after a page refresh with a prefilled input if I delete only one character.

My solution is to use keyup cut paste events instead of propertychange:

$('#myId').on('input keyup cut paste', function(e) {
    setTimeout(function() {
        doAwesomeThing();
    }, 0);
});

I used setTimeout with 0 delay because otherwise I would get the old input value on cut and paste events, see https://stackoverflow.com/a/9364812/2324685 for details.

You should note that this code might fire twice in some cases.

jquery .on('input') doesn't get fired in ie8 alone

6 Answers6

Linked