Home > Article > Web Front-end > Example of Jquery monitoring input value in real time

Example of Jquery monitoring input value in real time

高洛峰Original: 2017-02-03 14:12:211687browse

Examples are as follows:

<!DOCTYPE html> 
<html> 
<head> 
  <meta charset="UTF-8"> 
  <title>Document</title> 
</head> 
<body id="lia-body"> 
  <div> 
    <div> 
      <label><span>姓名：</span><input type="text" name="fullname"></label> 
      <div></div> 
    </div> 
  </div> 
  <script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script> 
  <script> 
    $(function(){ 
      var $inputwrapper = $(&#39;#lia-body .lia-content .inputwrapper&#39;); 
      $inputwrapper.find(&#39;input&#39;).on(&#39;input propertychange&#39;,function(){ 
        var result = $(this).val(); 
        console.log(result); 
        $inputwrapper.find(&#39;.result&#39;).html(result); 
      }); 
    }) 
  </script> 
</body> 
</html>

The onchange trigger event must meet two conditions:

1) The properties of the current object change and are triggered by keyboard or mouse events (script triggering is invalid)

2) The current object loses focus (onblur);

onpropertychange

As long as the properties of the current object change, the event will be triggered, but it is exclusive to IE;

oninput is the non-IE version of onpropertychange, supporting browsers such as firefox and opera

But the difference is that when it is bound to an object, not all property changes of the object can trigger events, only when the object It will only take effect when the value value changes.

This is a perfect place for us to monitor changes in input value.

The above example of Jquery monitoring input value in real time is all the content shared by the editor. I hope it can give you a reference, and I hope you will support the PHP Chinese website.

For more related articles about Jquery real-time monitoring of input value, please pay attention to the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：js and jquery real-time monitoring of the oninput and onpropertychange methods of the input box valueNext article：js and jquery real-time monitoring of the oninput and onpropertychange methods of the input box value

See more

Example of Jquery monitoring input value in real time

Related articles