HTML输入不允​​许数字

Question

现在，我有一个像这样的输入字段：

<input class="form-control" type="text"/>

但是它仍然允许输入数字。

我希望输入名称，并且要在字符串包含数字时显示错误消息。我该如何实现？

Answer 1

您可以使用本机HTML5字段验证

像电子邮件验证（小提琴）： <input type="text" title="email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" />

对于您的特定情况，您可以使用正则表达式，例如pattern="[a-zA-Z]*"（fiddle）

当您提交表单时，它会以红色边框突出显示，以向您显示验证错误。在不同的浏览器中，它的行为会略有不同。

我认为没有覆盖所有默认样式的标准方法，但是有特定于浏览器的方法（此处）。

对于某些样式，可以将CSS钩子放置在适当的位置以进行更改，请参见此处

编辑：更新小提琴。

Answer 2

这应该可以帮助您只输入字符：

$(function() {

  $('#txtNumeric').keydown(function (e) {
  
    if (e.shiftKey || e.ctrlKey || e.altKey) {
    
      e.preventDefault();
      
    } else {
    
      var key = e.keyCode;
      
      if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {
      
        e.preventDefault();
        
      }

    }
    
  });
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <b>Enter Text:</b>
  <input type="text" id="txtNumeric" />
</div>