Allows only one "." in Javascript during KeyPress - Stack Overflow

admin管理员组

文章数量:1294305

How to allow only one "." in javascript during Keypress?

I have a code here:

function allowOneDot(txt) {

        if ((txt.value.split(".").length) > 1) {

          //here, It will return false; if the user type another "."

         } 
}

How to allow only one "." in javascript during Keypress?

I have a code here:

function allowOneDot(txt) {

        if ((txt.value.split(".").length) > 1) {

          //here, It will return false; if the user type another "."

         } 
}

• javascript
• keypress

Share Follow asked Jan 29, 2013 at 1:49 portgas d aceportgas d ace 30933 gold badges99 silver badges2121 bronze badges 4

• 1 And what if the user pastes in a bunch of periods? What if they edit the javascript in their console to pletely ignore this check? Make sure you are handling validation correctly and not making too many simplifications. – jbabey Commented Jan 29, 2013 at 1:51
• 1 Why is it wrapped in a try/catch? – alex Commented Jan 29, 2013 at 1:51
• Why the try-catch? what are you asking about? – gdoron Commented Jan 29, 2013 at 1:52
• txt.value.split(".").length) > 2 and input/keyup/keydown event – zb' Commented Jan 29, 2013 at 1:53

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 6

I will reiterate what I said in my ment before the answer:

And what if the user pastes in a bunch of periods? What if they edit the javascript in their console to pletely ignore this check? Make sure you are handling validation correctly and not making too many simplifications.

Now that we're proceeding at our own risk, here's how you would not allow a user typing more than one . (period) in a textbox:

document.getElementById('yourTextboxIDHere').onkeypress = function (e) {
    // 46 is the keypress keyCode for period     
    // http://www.asquare/javascript/tests/KeyCode.html
    if (e.keyCode === 46 && this.value.split('.').length === 2) {
        return false;
    }
}

Working demo

If you really want to allow one dot, even in the event of a user pasting text inside it, you should use keyup, not keypress, and you could keep your last text value in case you need to restore it. The drawback though, is that the input value will have already been changed, and you will see it getting corrected as you type.

(function() {
    var txt = document.getElementById('txt');
    var prevValue = txt.value;

    function allowOneDot(e) {
        var dots = 0;
        var length = txt.value.length;
        var text = txt.value;
        for(var i=0; i<length; i++) {
            if(text[i]=='.') dots++;
            if(dots>1) {
                txt.value = prevValue;
                return false;
            }
        }
        prevValue = text;
        return true;
    }
    txt.onkeyup = allowOneDot;
})();

I solved this question for the multipurpose use of decimal, number & alphanumeric field types.

For field types 'number' and 'alphanum', parameter l (lower L) is the string length allowed. For type 'decimal', it specifies the allowed number of decimal places.

function allowType(e, o = 'number', l = false) {
    let val = e.target.value;
    switch (o) {
        case 'alphanum':
            if (l) {
                val = val.substr(0, l).replaceAll(/[^0-9a-zA-Z]/gmi, '');
            } else {
                val = val.replaceAll(/[^0-9a-zA-Z]/gmi, '');
            }
            break;
        case 'number':
            if (l) {
                val = val.substr(0, l).replaceAll(/[^0-9]/gmi, '');
            } else {
                val = val.replaceAll(/[^0-9]/gmi, '');
            }
            break;
        case 'decimal':
            let i = val.search(/\./gmi);
            if (val.length === 1) {
                val = val.replaceAll(/[^0-9]/gmi, '');
            }
            if (i >= 0) {
                if (l) {
                    val = val.substr(0, i + 1) + val.substr(i).substr(0, l + 1).replaceAll(/\./gmi, '');
                } else {
                    val = val.substr(0, i + 1) + val.substr(i).replaceAll(/\./gmi, '');
                }
            }
            val = val.replaceAll(/[^0-9.]/gmi, '');
            break;
    }
    e.target.value = val;
}

<input type="text" oninput="allowType(event, 'decimal', 2)" placeholder="decimal">
<input type="text" oninput="allowType(event, 'number', 10)" placeholder="number">
<input type="text" oninput="allowType(event, 'alphanum', 5)" placeholder="alphanumeric">

<input type="text" id="test" onkeyup="floatOnly(this);"/>



<script>
function floatOnly(i){
{
  if ((i.value).length > 0){else{i.value = i.value.replace(".." , ".");i.value = i.value.replace("..." , ".");i.value = i.value.replace(/[^0-9\.]/g , "");}}else{i.value = i.value="0";}}<script>

本文标签： Allows only one quotquot in Javascript during KeyPressStack Overflow