js amount text box implementation code_form special effects-JS Tutorial-php.cn

js amount text box implementation code_form special effects

WBOY

Release： 2016-05-16 17:56:07

Original

1021 people have browsed it

Case 1: Enter to realize Tab jump.
In response to the onKeyDown event of the text box, window.event.keyCode gets the keyCode clicked by the user.
(*) keyCode and ASCII are not exactly the same. The ASCII of 1 on the main keyboard and 1 on the small keyboard are the same, but the keyCode is different. The keyCode of Enter is 13, and the keyCode of Tab is 9.

Only a few keys can be replaced, most of them cannot. There is a permissions issue.
Keyboard codes are different from ASCII codes.
keyCode
8: Backspace key
46: delete
37-40: Direction keys
48-57: Numbers in the small keyboard area
96-105: Main keyboard area Numbers
110, 190: Decimal points in the small keyboard area and main keyboard area
189, 109: Negative signs in the small keyboard area and main keyboard area
13: Enter
9: Tab is that handle The focus moves to the next text box.
Case 2: Amount text box
Text boxes involving amounts in financial related systems have the following requirements:
Do not use the Chinese input method when entering the amount text text box
Cannot enter Non-numeric
When the focus is in the text box, the text box is left aligned; when the focus leaves the text box, the text box is right aligned and the thousandths are displayed
Disable input method: style="ime-mode:disabled" //Compatible with FF , IE, not compatible with Chrome
It is forbidden to type illegal values, only these can be typed (k == 9) || (k == 13) || (k==46)||(k==8)| |(k==189)||(k==109)||(k==190)||(k==110)|| (k>=48 && k<=57)||(k>= 96 && k<=105)||(k>=37 && k<=40). onkeydown="return numonKeyDown()" Do not write onkeydown="numonKeyDown()" to distinguish between event response functions and functions called by event response functions.
Disable pasting (great Tester), When the focus is on, it is left-aligned without a thousandth digit, and when the focus is not on, it is right-aligned with a thousandth digit. this.style.textAlign='right'
For the method of adding thousandths, see notes (*)
========Supplementary knowledge============== =====
(?=exp) matches the position before exp.
(?=exp) is also called a zero-width positive lookahead assertion. It asserts that the expression exp can be matched after the position where it appears. For example, w (?=ingb) matches the front part of a word ending in ing (other than ing). For example, when searching for I'm singing while you're dancing., it will match sing and dance.
================================

Copy Code The code is as follows:

 
function f(){ 
var txts=document.getElementsByTagName('input'); 
for(var i= 0;i//Enter is converted to tab 
txts[i].onkeydown=function(){ 
if(window.event.keyCode==13){ 
window.event.keyCode=9; 
} 
} 
txts[i].onpaste=function(){ 
var usrInput=clipboardData.getData('Text'); 
var k; 
for(var i=0;ik=usrInput.charCodeAt(i); 
//Can only be pasted. Or 0-9 Numbers, refer to the ASCII character set. 
if((k==46) ||(k>=48 && k<=56)){ 
}else{ 
return false; 
} 
} 
} 
} 
} 

Thousands (practice code):

Copy code The code is as follows:

 
function commafy(n) 
{ 
var re=/d{1,3}(?=(d{3}) $)/g; / / must end with d{3}, and must be preceded by 1-3 numbers, but when replacing, the ending d{3} numbers are not included. var n1=n.replace(/^(d )((.d )?)$/,function(s,s1,s2){return s1.replace(re,“$&,”) s2;}); 
 Return n1; 
} 
function addQianFenWei(txtBox) 
{ 
txtBox.value=commafy(txtBox.value); 
} 
function removeQianFenWei(txtBox) 
 { 
txtBox.value=txtBox.value.replace(/,/g,"");//If replace(',','') only replaces the first 
} 

Copy code The code is as follows: