财务相关系统中涉及到金额的文本框有如下要求:
• 进入金额文本文本框不使用中文输入法
• 不能输入非数字
• 焦点在文本框中时文本框左对齐;焦点离开文本框时文本框右对齐,显示千分位
1.禁用输入法:,禁止键入非法值,只有这些才能被键入(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()" 不要写成onkeydown="numonKeyDown()" 区分事件响应函数
和事件响应函数调用的函数。
2.禁止粘贴(伟大的Tester),<input onpaste="return false;" ,太暴力,应该只是禁
止粘贴非法值。在onpaste中通过clipboardData.getData('Text')取到粘贴板中的值,然后遍历每个字符,看是否是合法的值,如果全部是合法值才允许粘贴,只要有一个非法值就禁止粘贴。charAt、charCodeAt 添加千分位的方法,见备注
3.焦点在的时候左对齐没有千分位,焦点不在时右对齐千分位。
this.style.textAlign='right'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function initEvent() {
var txtAmount = document.getElementById("txtAmount");
txtAmount.onkeydown = onkeydownEvent; //键盘输入时效果,限制非法字符输入
txtAmount.onblur = onblurEvent;//焦点离开时的效果(数字向右对齐)
txtAmount.onpaste = function () {
var text = clipboardData.getData("text");
if (valid(text)) {
clipboardData.setData("text", text);
}
else {
return false;
}
}; //禁止粘贴1.4
}
function valid(txt) {
var i = 0;
var len = txt.length;
for (i = 0; i < len; i++) {
var checkTxt = txt.charCodeAt(i); //使用charCodeAt方法,方法可返回指定位置的字符的 Unicode 编码。这个返回值是 0 - 65535 之间的整数。
if (checkTxt == 37 || checkTxt == 8 || checkTxt == 39 || checkTxt == 46 || checkTxt == 190 || checkTxt == 110 || (checkTxt >= 48 && checkTxt <= 57) || (checkTxt >= 96 && checkTxt <= 105)) {
continue;
}
else {
return false;
}
}
return true;
}
function onkeydownEvent() {
if (event.keyCode == 37 ||event.keyCode==8|| event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190 || event.keyCode == 110 || (event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105)) {
}
else {
return false;
}
}
function onblurEvent() {
// var txtAmount = document.getElementById("txtAmount");
this.style.textAlign = "right";
// txtAmount.value = txtAmount.value + '';
this.value = commafy(this.value);
}
function commafy(n) {
n = n + "";
var re = /(-?\d+)(\d{3})/;
while (re.test(n)) {
n = n.replace(re, "$1,$2");
}
return n;
// var n1 = n.replace(/^(\d+)((\.\d+)?)$/, function (s, s1, s2) { return s1.replace(re, "$1,$2") + s2; });
//return n1;
}
</script>
</head>
<body onload="initEvent()">
<input type="text" id="txtAmount" onclick="this.style.textAlign='left';this.value=this.value.replace(/,/g,'');" />
</body>
</html>