你如何得到一个变异观察者来检测textarea的值变化？

Question

I have seen mutation observers used to obtain the properties of doms when they are modified such as with the google chrome developer tools. I can't, however, find how to call a function when the text within a textarea changes due to a user typing or pasting. In my code, as the user types the callbacks don't get called, even with all the observe options set to true. What is the code for this?

Answer 1

The mutation observers listen for changes of the DOM. The current state of form elements, however, is not reflected by the DOM.

For example, create an input element input without setting the value attribute. When text is being entered into the input field, input.value reflects this text. On the other hand, input.getAttribute('value') still returns null .

Therefore, the mutation observers can't observe this change in the form field's status.

(Object.observe of the proposed ECMAScript 6th edition also doesn't help. Although one can listen on changes of host objects in recent versions of Chrome, changes of host object properties like value of input above are not being observed.)

Answer 2

See this link Textarea onchange detection . You will need to write onkeyup and onchange function.

By the way, the answer above will not work for an input method. My solution is setInterval to detect if the text has changed every 50 ms.