jquery/JS只允许在文本框中输入数字和字母

4

您可以使用一个简单的正则表达式对表单提交以评估文本框的内容，显示错误并停止表单提交。从支票中取出一个功能，当文本框失去焦点时，您也可以应用它。经常这样做，你会发现你已经重新实现了验证插件。

$(function() { 
    $('form').submit(function() { 
     return validateTB($('#textbox'), true, $('#textboxError')); 
    }); 

    $('#textbox').blur(function() { 
     validateTB($(this), true, $('#textboxError')); 
    }); 

    function validateTB(tb,required,msg) { 
     var $tb = $(tb); 
     var re = '/^[a-z0-9]'; 
     if (required) { 
      re += '+'; 
     } 
     else { 
      re += '*'; 
     } 
     re += '$/'; 

     if ($tb.val().match(re) == null) { 
      $(msg).show(); 
      return false; 
     } 
     $(msg).hide(); 
     return true; 
    } 
});

来源

2010-01-03 17:22:09 tvanfosson

+0

+1 - >不错片断 – JohnIdol 2010-01-03 19:49:57

3

如果你不想使用插件 - 那么一些普通的旧JS验证呢？

我张贴有关这位在我的博客前一阵子 - >http://dotnetbutchering.blogspot.com/2009/04/definitive-javascript-validation-with.html

你会看到，我提出的解决方案的功能需要输入域ID和一个正则表达式（你将不得不拿出如果您只需要aplhanumeric，那么对于您的验证需求使用regEx应该非常简单），并根据验证的结果将控件的背景设置为绿色或红色。我知道这并不完美，但我认为这足以让你走了，你可以用它作为自己的起点。

我相信有mote优雅的解决方案使用jQuery或普通的JS，但沿着这些线的东西到目前为止一直工作得很好。

希望它有帮助。

来源

2010-01-03 16:54:35 JohnIdol

4

我的解决办法是这样的：

jQuery('input[type="text"]').keyup(function() { 
    var raw_text = jQuery(this).val(); 
    var return_text = raw_text.replace(/[^a-zA-Z0-9 _]/g,''); 
    jQuery(this).val(return_text); 
});

每一个用户尝试输入不是数字，字母，空格等任何东西，或强调功能的时间返回与去除带状字符的字符串。

来源

2012-06-20 00:35:41 Ian

+0

作品完美:)这个我觉得是一个更好的方法，因为它已经阻止用户输入无效字符。 :)如何在用户按下提交按钮时阻止任何提交，如果文本框中没有条目，我该怎么办？ – Si8 2014-01-21 02:26:29

+0

我的方法不是最安全的方法，而是使用jQuery隐藏提交按钮，直到数据正确。不利的一面是用户可以通过使用调试器来显示按钮。所以失败保险箱是在提交后添加检查以确保数据是正确的。然后通知用户他们的错误。 – Ian 2014-01-22 14:12:57

1

由于tvanfossen的片段只触发了对提交和伊恩的不漂亮，因为它可以，我只是想增加一个更简洁的方法：

HTML：

<input id="myinput" type="text">

JS（jQuery的）：

$('#myinput').keypress(function (e) { 
    var regex = new RegExp("^[a-zA-Z0-9]+$"); 
    var str = String.fromCharCode(!e.charCode ? e.which : e.charCode); 
    if (regex.test(str)) { 
     return true; 
    } 
    e.preventDefault(); 
    return false; 
});

来源

2014-01-03 02:02:43 FlyingLemon

+0

我在这个方法中发现问题，当我复制并粘贴这些章程输入字段'＃$％^＆*（）'它不会阻止这些章程 – 2015-01-31 17:32:41

0

这是一个简单的解决方案，将检查KEYUP输入和去除不想要的字符作为用户类型：

<input class="usr" type="text id="whatever" name="whatever" /> 

     $(".usr").keyup(function() { 
      var n = $(this).val(); 
      if (n.match("^[a-zA-Z0-9 ]*$") == null) { 
       $(this).val(n.slice(0,-1)); 
      } 
     });

正则表达式可以根据规范进行修改。

来源

2017-08-30 12:40:03

0

在伊恩的回答变种是一个小更轻便，更短：

function onlyAllowAlphanumeric() { 
    this.value = this.value.replace(/[^a-zA-Z0-9 _]/g, ''); 
}); 

$('input[type="text"]').keyup(onlyAllowAlphanumeric);

来源

2017-08-30 12:45:09 Martijn

jquery/JS只允许在文本框中输入数字和字母

回答

相关问题