Code
Method 1:
<!DOCTYPE html> <html> <head> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <title>test</title> </head> <body> <input class="et-name" type="input" name="name"> <script type="text/javascript"> $(function () { $(".et-name").bind("input propertychange", function () { console.log($(".et-name").val()); }); }); </script> </body> </html>
Mode two:
<!DOCTYPE html> <html> <head> <title>test</title> </head> <body> <input class="et-name" type="input" name="name" oninput="myFun()"> <script type="text/javascript"> function myFun() { console.log($(".et-name").val()); } </script> </body> </html>
Mode three:
<!DOCTYPE html> <html> <head> <title>test</title> </head> <body> <input class="et-name" type="input" name="name" onchange="myFun()"> <script type="text/javascript"> function myFun() { console.log($(".et-name").val()); } </script> </body> </html>
Similarly, it can input xxx characters for Weibo
Usage of oninput,onpropertychange,onchange
The onchange trigger event must satisfy two conditions:
A) the current object property changes and is triggered by a keyboard or mouse event (invalid script trigger)
b) the current object loses focus (onblur);
On property change, as long as the current object property changes, the event will be triggered, but it is exclusive to IE;
oninput is a non IE browser version of onpropertychange. It supports firefox, opera and other browsers, but it is different. When it is bound to an object, not all property changes of the object can trigger events. It only works when the value of the object changes.