📄 jsnumberformatting.html

📁 The control uses javascript to handle number formatting as you keep typing and does the validation a
💻 HTML
字号:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="_Default" %>

<!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 runat="server">
    <title>Untitled Page</title>

    <script language="javascript" type="text/javascript">
          <!--
         
        function ValidateNumberKeyPress(field, evt)
        {
            var charCode = (evt.which) ? evt.which : event.keyCode
            var keychar = String.fromCharCode(charCode);

            if (charCode > 31 && (charCode < 48 || charCode > 57) && keychar != "."  && keychar != "-" )
            {
                return false;
            }

            if (keychar == "." && field.value.indexOf(".") != -1) 
            {
                return false;
            }
                
            if(keychar == "-")
            {
                if (field.value.indexOf("-") != -1 /* || field.value[0] == "-" */) 
                {
                    return false;
                }
                else
                {
                    //save caret position
                    var caretPos = getCaretPosition(field);
                    if(caretPos != 0)
                    {
                        return false;
                    }
                }
            }

            return true;
        }

        function ValidateNumberKeyUp(field)
        {
            if(document.selection.type == "Text")
            {
                return;
            }
        
             //save caret position
            var caretPos = getCaretPosition(field);
            
            var fdlen = field.value.length;
       
            UnFormatNumber(field);
 
            var IsFound = /^-?\d+\.{0,1}\d*$/.test(field.value);
            if(!IsFound)
            {
                setSelectionRange(field, caretPos, caretPos);
                return false;             
            }
            
            field.value = FormatNumber(field.value);
            
            fdlen = field.value.length - fdlen;

            
            setSelectionRange(field, caretPos+fdlen, caretPos+fdlen);
        }

        function ValidateAndFormatNumber(NumberTextBox)
        {
            if(NumberTextBox.value == "") return;
            
            UnFormatNumber(NumberTextBox);

            var IsFound = /^-?\d+\.{0,1}\d*$/.test(NumberTextBox.value);
            if(!IsFound)
            {
                alert("Not a number");
                NumberTextBox.focus();
                NumberTextBox.select();  
                return;             
            }
            
            if(isNaN(parseFloat(NumberTextBox.value)))
            {
                alert("Number exceeding float range");
                NumberTextBox.focus();
                NumberTextBox.select();               
            }

            NumberTextBox.value = FormatNumber(NumberTextBox.value);
        }
        
        function FormatNumber(fnum)
        {
            var orgfnum = fnum;
            var flagneg = false;
            
            if(fnum.charAt(0) == "-")
            {
                flagneg = true;
                fnum = fnum.substr(1, fnum.length-1);
            }
            
            psplit = fnum.split(".");

            var cnum = psplit[0],
	            parr = [],
	            j = cnum.length,
	            m = Math.floor(j / 3),
	            n = cnum.length % 3 || 3;

            // break the number into chunks of 3 digits; first chunk may be less than 3
            for (var i = 0; i < j; i += n) {
	            if (i != 0) {n = 3;}
	            parr[parr.length] = cnum.substr(i, n);
	            m -= 1;
            }

            // put chunks back together, separated by comma
            fnum = parr.join(",");

            // add the precision back in
            //if (psplit[1]) {fnum += "." + psplit[1];}
            if (orgfnum.indexOf(".") != -1)  
            {
                fnum += "." + psplit[1];
            }
            
            if(flagneg == true)
            {
                fnum = "-" + fnum;
            }
            
            return fnum;
        }
           
        function UnFormatNumber(obj)
        {
            if(obj.value == "") return;
            
            obj.value = obj.value.replace(/,/gi, "");
        }
        
        function getCaretPosition(objTextBox){

            var objTextBox = window.event.srcElement;

            var i = objTextBox.value.length;

            if (objTextBox.createTextRange){
                objCaret = document.selection.createRange().duplicate();
                while (objCaret.parentElement()==objTextBox &&
                  objCaret.move("character",1)==1) --i;
            }
            return i;
        }

        function setSelectionRange(input, selectionStart, selectionEnd) {
            if (input.setSelectionRange) {
                input.focus();
                input.setSelectionRange(selectionStart, selectionEnd);
            }
            else if (input.createTextRange) {
                var range = input.createTextRange();
                range.collapse(true);
                range.moveEnd('character', selectionEnd);
                range.moveStart('character', selectionStart);
                range.select();
            }
        }

      //-->

    
    </script>

</head>
<body>
    <form id="Form1" runat="server">
        <div>
            <input id="Text1" onkeypress="return ValidateNumberKeyPress(this, event);" onkeyup="ValidateNumberKeyUp(this);"
                onblur="ValidateAndFormatNumber(this)" type="text" />
        </div>
    </form>
</body>
</html>
💿 文件大小 3 K
👤 上传用户 zl357159
📂 所属分类 Internet/网络编程
🏷️ 相关标签

#javascript #formatting #validation #control
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -