jquery monitors the value change of textare input

  js monitors the real-time change of the input box value. There are many explanations about onpropertychange and oninput on the Internet, but they are not what I want. What I want is to dynamically monitor the input, textarea and other values ​​before and after changes, such as KISSY The same valuechange event in , when I start to enter 1 in the input box, the previous value is undefined, and the current value is 1. When I then enter 2, the previous value is 1, and the current value is 2. Wait, I want to get this effect, because if there is such a method, it will be very convenient for me to do input, textarea and other operations in the future. For example, I want to monitor the change of the textarea value. If it changes, what should I do? The operation, what should I do if the value doesn't change, is very convenient to use.

 

$.event.special.valuechange = {

  teardown: function (namespaces) {
    $(this).unbind('.valuechange');
  },

  handler: function (e) {
    $.event.special.valuechange.triggerChanged($(this));
  },

  add: function (obj) {
    $(this).on('keyup.valuechange cut.valuechange paste.valuechange input.valuechange', obj.selector, $.event.special.valuechange.handler)
  },

  triggerChanged: function (element) {
    var current = element[0].contentEditable === 'true' ? element.html() : element.val()
      , previous = typeof element.data('previous') === 'undefined' ? element[0].defaultValue : element.data('previous')
    if (current !== previous) {
      element.trigger('valuechange', [element.data('previous')])
      element.data('previous', current)
    }
  }
}

 

$(function () {
      $('#text').on('valuechange', function (e, previous) {
          $('#output').append('previous: ' +  previous +  '  --  current: ' + $(this).val() + '<br />')
        })
 })

 

HTML test code:

<input id="text" type="text" />
<div id="output"></div>

 

Source:  http://www.cnblogs.com/tugenhua0707/p/3733395.html