【问题标题】:Validate date on keypress not working验证按键日期不起作用
【发布时间】:2014-10-24 00:12:49
【问题描述】:

这是正则表达式:

 pattern =/^([0-9]{2})-([0-9]{2})-([0-9]{4})$/;

大家好,我找到了一个简单的日期格式正则表达式,没有检查闰年,但在我的小提琴上我仍然可以输入其他无效字符。 请看我的FIDDLE

【问题讨论】:

  • 您示例中的正则表达式用于匹配完整的日期格式,而不是限制可以输入的内容。此外,您正在使用双等号来分配模式。
  • 双等号错字,所以输入时应保留对日期的验证?
  • 抱歉,我的第一条消息有点短。如果我正确理解了这个问题,您希望用户在键入日期时以完全特定的格式输入日期。所以他们不能输入字母或任何东西,只能输入两个数字、一个连字符、另外两个数字、一个连字符,然后是四个数字。这是目标吗?
  • 是的,先生,这是我的目标,通过使用按键事件。 @getWeberForStackExchange
  • 来自 tbh__ 的好正则表达式

标签: javascript jquery regex


【解决方案1】:

http://jsbin.com/ruhaxo/9/edit

你的代码让我有点不舒服,所以我试着写得更简单,这样更容易阅读,你可以拉出你需要的部分,我真的认为这只是 event.preventDefault()当有比赛时。也只是为了扩展:http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes 您正在寻找字符代码而不是文字数字。

    $('input').on('keypress', function (e) {
      var leng = $(this).val().length;

      if (window.event) {
        code = e.keyCode;
      }else {
        code = e.which;
      };

      var allowedCharacters = [49,50,51,52,53,54,55,56,57,48,45];
      var isValidInput = false;

      for (var i = allowedCharacters.length - 1; i >= 0; i--) {
        if(allowedCharacters[i] == code){
          isValidInput = true;
        } 
      };

      if(isValidInput === false || /* Can only input 1,2,3,4,5,6,7,8,9 or - */
       (code == 45 && (leng < 2 || leng > 5 || leng == 3 || leng == 4)) ||
       ((leng == 2 || leng == 5) && code !== 45) || /* only can hit a - for 3rd pos. */
        leng == 10 ) /* only want 10 characters "12-45-7890" */
      {

        event.preventDefault();
        return;
      }

    });

您也可以使用对象而不是数组来执行此操作。哪个更容易阅读:

    $('input').on('keypress', function (e) {
      var leng = $(this).val().length;

      if (window.event) {
        code = e.keyCode;
      }else {
        code = e.which;
      };

      var allowedCharacters = {49:1,50:2,51:3,52:4,53:5,54:6,55:7,56:8,57:9,48:0,45:'-'}; /* KeyCodes for 1,2,3,4,5,6,7,8,9,- */

      if(typeof allowedCharacters[code] === 'undefined'|| /* Can only input 1,2,3,4,5,6,7,8,9 or - */
         (code == 45 && (leng < 2 || leng > 5 || leng == 3 || leng == 4)) ||
         ((leng == 2 || leng == 5) && code !== 45) || /* only can hit a - for 3rd pos. */
          leng == 10 ) /* only want 10 characters "12-45-7890" */
      {

        event.preventDefault();
        return;
      }

    });

已编辑:

请注意这一点,我尚未对此进行全面测试,但我编辑了上述帖子中的正则表达式,如果除了上述其他选择之一之外,您还有这个,(这发生在其他检查之后的 keyup 上已完成)这将验证格式为 mm-dd-yyyy 的日期,请检查它是否正常工作,我尝试了 02-29-2008,这是我能想到的第一个闰年,它有效,但我建议测试修改后更多了。

$('input').on('keyup',function(e){

  /* From:
  http://stackoverflow.com/questions/17503043/javascript-regular-expression-to-validate-date-in-mm-dd-yyyy-format
  and
  http://jsfiddle.net/LSsMc/
  */

  var thisVal = $(this).val();
  var leng = thisVal.length;

  var reg = new RegExp(/^(((0[13578]|1[02])\-(0[1-9]|[12]\d|3[01])\-((19|[2-9]\d)\d{2}))|((0[13456789]|1[012])\-(0[1-9]|[12]\d|30)\-((19|[2-9]\d)\d{2}))|(02\-(0[1-9]|1\d|2[0-8])\-((19|[2-9]\d)\d{2}))|(02\-29\-((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))))$/g);
  if(leng == 10){
    if(reg.test(thisVal)){
      console.log('Valid Date');
    }else {
      event.preventDefault();
      return;
    } 
  }
});

【讨论】:

  • 嗨@tbh__我会试试你的代码。所以我可以稍后提出问题。谢谢
  • 酷,仅供参考,这并不能阻止人们将随机字符串粘贴到框中,但这超出了问题的范围。
  • 您的代码对我有很大帮助,但无论如何我可以添加一些检查有效日期、闰年和一个月的正确天数吗?我也想为此添加正则表达式。
  • 是的,我知道我有不同的事件可以处理。谢谢
  • 它有点笨拙,但可以进行优化。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-09-15
  • 1970-01-01
  • 2020-10-02
相关资源
最近更新 更多