Detect whether the input is legal every time, there is a problem when you encounter Chinese character input.

Record the information, test it in the past few days and release the results

Copy the codeThe code is as follows:

 
<input type="text" value="xxx"  onclick="='xx'"> 
<script type="text/javascript"> 
<!-- 
('xx').attachEvent('onpropertychange',function(o){alert('ok')}); 
//--> 
</script> 

Execute the above code and click the input box to find that onpropertychange will also trigger. Entering a value will also trigger this event. This proves that as long as the value of the property is modified, the event will be triggered.

Second, since we have discovered this feature, there will be a problem: sometimes we want to perform a function operation when the input box value changes, but at the same time we also need to modify a custom property, so that the onpropertychange will be triggered twice, which may not be what we want.
Guess, since such a property is provided, it must be possible to obtain which property has been changed. Try to get the number of parameters and the content of the parameters.

Copy the codeThe code is as follows:

 
<input type="text" value="xxx"  onclick="='xx'"> 
<script type="text/javascript"> 
<!-- 
('xx').attachEvent('onpropertychange',function(){ 
alert(); 
for(var i=0;i<;i++){ 
alert(arguments[i]); 
} 
}); 
//--> 
</script> 

Execute the above code and you will find that 1 and [object] pop up, which means that the event only passes one parameter to the callback function and is of type object.
Then let's try traversing this object.

Copy the codeThe code is as follows:

 
<input type="text" value="xxx"  onclick="='xx'"> 
<script type="text/javascript"> 
<!-- 
('xx').attachEvent('onpropertychange',function(o){ 
for(var item in o){ 
alert(item+":"+o[item]); 
} 
}); 
//--> 
</script> 

After executing it, we found that there are many attributes, but if we look closely, we may find such an attribute: propertyname. I believe everyone can guess the meaning of this attribute. Yes, this is used to obtain which attribute is modified.

Copy the codeThe code is as follows:

 
<input type="text" value="xxx"  onclick="='xx'"> 
<script type="text/javascript"> 
<!-- 
('xx').attachEvent('onpropertychange',function(o){ 
alert(); 
}); 
//--> 
</script> 

Click the text box and enter a value separately, and you will find that myprop and value pop up respectively.

Going back to the question we started, we just need to judge whether the value has been changed and it will be OK.
Just look at the code:

Copy the codeThe code is as follows:

 
<input type="text" value="xxx"  onclick="='xx'"> 
<script type="text/javascript"> 
<!-- 
('xx').attachEvent('onpropertychange',function(o){ 
if(!='value') return; //If you do not change the value, do not perform the following operation
//....... Function processing
}); 
//--> 
</script> 

3. Let FF support onPropertyChange similar effects

I did a real-time verification of the input box before, such as only numbers are allowed, but the user inputs are letters, etc. At this time, the value entered by the user is turned into red, etc., or a prompt for the remaining characters that can be entered in the text field of textarea, I encountered a problem. It is normal to use onPropertyChange in IE, but it is very effective in FF~~~

So I found a feasible method online~~ Firefox has an oninput event effect that is the same as onPropertyChange, so adding oninput and onPropertyChange problems at the same time will solve the problem of birds~~~ oo...

<input type="text" oninput="cgColor(this);" onPropertyChange="cgColor(this);" maxlength="4" name="pt_bankou" value="" />