Home > Article > Web Front-end > Real-time statistics on the number of words in the input box—about the use of onpropertychange and oninput_form effects
I saw events on the Internet that are very convenient for implementing this function:
onpropertychange in IE
oninput in non-IE
The advantage of using these two events is that when the content of the input box changes, the event is called using key Events related to mouse will be more complicated, and this method is as effective as the paste method. However, these two events will not occur when changing the input value using js.
Just add two event methods in the Chinese text box. (I saw on the Internet that the oninput method in non-ie needs to be bound with addEventListener, and element.oninput = function(){...} will not work, but I can do it in Firefox 6, but for the sake of safety, I still do it here Use the standard method element.addEventListener('input', function(){...}) to implement)
Use the element.attachEvent('onpropertychange', function(){...}) method in IE. However, because IE will determine that all attributes have changed, a lot of unnecessary work will occur, and sometimes problems will occur and functions cannot be called. So here I only judge when the value attribute changes (propertyName attribute of the event object) and call the method. The result is:
element.attachEvent('onpropertychange', function(){if(window.event.propertyName == "value"){...})