Javascript验证：单击提交时阻止输入文本框中的特殊字符答案

【问题标题】：Javascript validation: Block special characters From input text box when click on submitJavascript验证：单击提交时阻止输入文本框中的特殊字符
【发布时间】：2014-07-25 05:39:39
【问题描述】：

如何通过编辑以下验证代码来限制在文本框 (txt_edition) 中输入特殊字符？我只想输入数字。

<script>
function validateForm() 
{
var x = document.forms["frm_bokAdd"]["txt_edition"].value;
if (x==null || x=="") 
{
    alert("Edition must be filled out");
    return false;
} 
</script>

下面是我的表格

<form  name="frm_bokAdd" action ="#"  method="post" onsubmit="return validateForm()" >
<table border="0" align="center">
    <tr><td> <input type="text" name="txt_edition" ></td></tr>
    <tr><td> <input type="submit" name="bookIns_submit" value="Add"></td></tr>
</table>
</form>

【问题讨论】：

请注意，其中 x 是表单控件的值，那么 x == null 将始终为 false。只需测试 /\D/.test(x) 是否返回 true 则 x 包含非数字字符。
您是否希望该字段接受'.'以及'.'之后应该允许多少个数字

标签： javascript php jquery validation

【解决方案1】：

可以用这个

HTML

<input type="text" onkeypress="return isNumber(event)" >

JS（在正文结尾）

function isNumber(evt) {
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57)) {
        return false;
    }
    return true;
}

DEMO is Here

【讨论】：

【解决方案2】：

如何限制在文本框中输入特殊字符（txt_edition）

不要。允许用户以任何他们喜欢的方式获得有效值，您真的只关心该值在发送到服务器时是否有效，即使那样您也应该在那里进行验证。

通过编辑下面的代码进行验证？我只想输入数字。

只在表单提交时进行测试，在调用中传递对表单的引用：

<form ... onsubmit="return validateForm(this)" >

和功能：

function validateForm(form) {
  var value = form.txt_edition.value;

  if (/\D/.test(value) || value == '') {
    alert("Edition must be filled out and contain only numbers");
    return false;
  }
}

【讨论】：

非常感谢@RobG :D 这正是我想要的... :D

【解决方案3】：

使用正则表达式。

if (x.match(/^[0-9]*\.[0-9]*$/) !== null) {
   //text is only numbers (use /^[0-9]*$/ for integers)
}

【讨论】：

【解决方案4】：

试试看

 <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <style type="text/css">
            body
            {
                font-size: 9pt;
                font-family: Arial;
            }
        </style>
    </head>
    <body>
        Alphanumeric value:
        <input type="text" id="text1" onkeypress="return IsAlphaNumeric(event);" ondrop="return false;"
            onpaste="return false;" />
        <span id="error" style="color: Red; display: none">* Special Characters not allowed</span>
        <script type="text/javascript">
            var specialKeys = new Array();
            specialKeys.push(8); //Backspace
            specialKeys.push(9); //Tab
            specialKeys.push(46); //Delete
            specialKeys.push(36); //Home
            specialKeys.push(35); //End
            specialKeys.push(37); //Left
            specialKeys.push(39); //Right
            function IsAlphaNumeric(e) {
                var keyCode = e.keyCode == 0 ? e.charCode : e.keyCode;
                var ret = ((keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 97 && keyCode <= 122) || (specialKeys.indexOf(e.keyCode) != -1 && e.charCode != e.keyCode));
                document.getElementById("error").style.display = ret ? "none" : "inline";
                return ret;
            }
        </script>
    </body>
    </html>

【讨论】：

【解决方案5】：

尝试使用正则表达式 -

    var edition = document.getElementById('txt_edition').value;
    outputVal = edition.replace(/[^0-9a-zA-Z]/g,"");       
    if (edition != outputVal) {
        return false;
    }

【讨论】：

【解决方案6】：

您可以像下面这样限制按键，

function restrict_letters(e) {
    var keyCode = e . keyCode == 0 ? e . charCode : e . keyCode;
    // only 0 to 9
    if (keyCode < 48 && keyCode > 57) {
        return false;
    }
}

您可以在here获取更多的关键代码。

还可以像下面这样更改 html 函数调用，

<input type="text" onkeypress="return restrict_letters(event)">

注意：函数调用需要给输入字段而不是表单提交。

【讨论】：

【解决方案7】：

只允许用户输入数字和点。使用这个正则表达式

 function NumAndTwoDecimals(event , obj){
    reg = /[^0-9.,]/g;
    obj.value =  obj.value.replace(reg,"");
 }

SEE DEMO HERE

HTML 代码是

<input id="txtId" type="text" onkeyup="NumAndTwoDecimals(event , this);"></input>

限制用户在“.”后只能输入两个数字运营商使用

 function NumAndTwoDecimals(e , field) {
    var val = field.value;
    var re = /^([0-9]+[\.]?[0-9]?[0-9]?|[0-9]+)$/g;
    var re1 = /^([0-9]+[\.]?[0-9]?[0-9]?|[0-9]+)/g;
    if (re.test(val)) {
        //do something here

    } else {
        val = re1.exec(val);
        if (val) {
            field.value = val[0];
        } else {
            field.value = "";
        }
    }
}

SEE DEMO HERE

【讨论】：