Javascript无法处理所有输入

时间:2016-12-15 21:30:26

标签: javascript numbers

我有一个脚本管理允许按哪个键,哪个没有,一切正常,但它只适用于一个输入...所以第一个! 如何保持它为多个输入工作?

First input <input type="text" id="inputs" /><br>
Second input <input type="text" id="inputs" />


<script type='text/javascript'>
    toHtmlNumericInput('inputs');
    // call this function with the id of the input textbox you want to be html-numeric-input
    // by default, decimal separator is '.', you can force to use comma with the second parameter = true
    function toHtmlNumericInput(inputElementId, useCommaAsDecimalSeparator) {
        var textbox = document.getElementById(inputElementId);
        // called when key is pressed
        // in keydown, we get the keyCode
        // in keyup, we get the input.value (including the charactor we've just typed
        textbox.addEventListener("keydown", function _OnNumericInputKeyDown(e) {
            var key = e.which || e.keyCode; // http://keycode.info/
            if (!e.shiftKey && !e.altKey && !e.ctrlKey &&
                // alphabet
                key >= 65 && key <= 90 ||
                // spacebar
                key == 32) {
                e.preventDefault();
                return false;
            }
            if (!e.shiftKey && !e.altKey && !e.ctrlKey &&
                // numbers
                key >= 48 && key <= 57 ||
                // Numeric keypad
                key >= 96 && key <= 105 ||
                // allow: Ctrl+A
                (e.keyCode == 65 && e.ctrlKey === true) ||
                // allow: Ctrl+C
                (key == 67 && e.ctrlKey === true) ||
                // Allow: Ctrl+X
                (key == 88 && e.ctrlKey === true) ||
                // allow: home, end, left, right
                (key >= 35 && key <= 39) ||
                // Backspace and Tab and Enter
                key == 8 || key == 9 || key == 13 ||
                // Del and Ins
                key == 46 || key == 45) {
                return true;
            }
            var v = this.value; // v can be null, in case textbox is number and does not valid
            // if minus, dash 
            if (key == 109 || key == 189) {
                // if already has -, ignore the new one
                if (v[0] === '-') {
                    // console.log('return, already has - in the beginning');
                    return false;
                }
            }
            if (!e.shiftKey && !e.altKey && !e.ctrlKey &&
                // comma, period and numpad.dot
                key == 190 || key == 188 || key == 110) {
                // console.log('already having comma, period, dot', key);
                if (/[\.,]/.test(v)) {
                    // console.log('return, already has , . somewhere');
                    return false;
                }
            }
        });
        textbox.addEventListener("keyup", function _OnNumericInputKeyUp(e) {
            var v = this.value;
            if(false) {
            // if (+v) { 
                // this condition check if convert to number success, let it be
                // put this condition will have better performance
                // but I haven't test it with cultureInfo = comma decimal separator, so, to support both . and , as decimalSeparator, I remove this condition
                //                      "1000"  "10.9"  "1,000.9"   "011"   "10c"   "$10"
                //+str, str*1, str-0    1000    10.9    NaN         11      NaN     NaN
            } else if (v) {
                // refine the value

                // this replace also remove the -, we add it again if needed
                v = (v[0] === '-' ? '-' : '') + 
                    (useCommaAsDecimalSeparator ? 
                        v.replace(/[^0-9\,]/g, '') : 
                        v.replace(/[^0-9\.]/g, ''));

                // remove all decimalSeparator that have other decimalSeparator following. After this processing, only the last decimalSeparator is kept.
                if(useCommaAsDecimalSeparator){
                    v = v.replace(/,(?=(.*),)+/g, '');
                } else {
                    v = v.replace(/\.(?=(.*)\.)+/g, '');
                }
                this.value = v; // update value only if we changed it
            }
        });
    }
</script>

例如2或4个其他字段或将其应用于页面上的每个字段:/,是否可以?

1 个答案:

答案 0 :(得分:5)

您的输入字段具有相同的ID,其ID应该是唯一的。为字段指定唯一ID,然后为每个ID调用toHtmlNumericInput函数。