HTML输入文本:禁用全大写数字

html input text: disable full uppercase digit

本文关键字:数字 输入 文本 HTML      更新时间:2023-09-26

在一个表单中,我有一个简单的输入文本字段,用户在其中插入一个标题。

<input type="text" name="title_input" id="title_input" value="" />

我不希望用户可以插入一个完整的大写数字。

我想让禁用数字,像这样:

    想要像这样启用数字:

    • Lorem ipsum 16V dolv C4 sit

    我已经知道将所有文本转换为小写的方法,但这不是我想要的。

    <input type="text" onkeyup="this.value=this.value.toLowerCase();" name="title_input" id="title_input" value=""  />
    

    <input type="text" pattern="[a-z]+" title="only lowercase" name="title_input" id="title_input" value=""  />
    

    如果我输入"LOREM IPSUM 16V DOLOR C4 SIT",我做不是想要将所有字符转换为小写,像这样:

    • lorem ipsum 16v dol4 sit

    但是我想转换成这样:

    • Lorem ipsum 16V dolv C4 sit

    我可以做这个验证与html5 javascript或jquery。怎么做呢?

    ,

    谢谢Vasil,这不是我想要的,但如果标题是全大写的,它可以是显示错误消息的一个有用的替代方法。

    function validateForm() {
        var titleEl = document.getElementById('title_input');
      var title = titleEl.value;
      var upperLength = 0;
      var Ncount = 0;
      var CharCount = 0;
      for (var i = 0; i < title.length; i++) {
        if( isNaN(title[i]) ){
        upperLength += (title[i] === title[i].toUpperCase() ? 1 : 0);
        }else{ Ncount = Ncount + 1; }
      }
      CharCount = title.length - Ncount;
      if (upperLength === CharCount) {
        alert('Invalid title');
        return false;
      }
      return true;
    };
    

    那么单词呢,检查大写单词?

    错误的标题必须返回错误:

    • "SELLING iPAD NEW"

    • "销售雪铁龙C4 NEW"

    jsfriddle

    <form onsubmit="return validateForm()">
      <input type="text" value="" id="title_input" />
      <input type="submit"  />
    </form>
    
    <script>
    function validateForm() {
        var titleEl = document.getElementById('title_input');
      var title = titleEl.value;
      var upperLength = 0;
      for (var i = 0; i < title.length; i++) {
        upperLength += (title[i] === title[i].toUpperCase() ? 1 : 0);
      }
      if (upperLength === title.length) {
        alert('Invalid title');
        return false;
      }
      return true;
    };
    </script>