如何使用 jquery 验证这种格式 (yyyy-mm-dd) 的日期？

IT技术 javascript jquery
2021-02-23 16:50:01

我正在尝试以这种格式验证日期：（yyyy-mm-dd）。我找到了这个解决方案，但它的格式不符合我的需要，例如：(mm/dd/yyyy)。

这是该解决方案的链接：http : //jsfiddle.net/ravi1989/EywSP/848/

我的代码如下：

function isDate(txtDate)
{
    var currVal = txtDate;
    if(currVal == '')
        return false;

    var rxDatePattern = /^(\d{1,2})(\/|-)(\d{1,2})(\/|-)(\d{4})$/; //Declare Regex
    var dtArray = currVal.match(rxDatePattern); // is format OK?

    if (dtArray == null) 
        return false;

    //Checks for mm/dd/yyyy format.
    dtMonth = dtArray[1];
    dtDay= dtArray[3];
    dtYear = dtArray[5];        

    if (dtMonth < 1 || dtMonth > 12) 
        return false;
    else if (dtDay < 1 || dtDay> 31) 
        return false;
    else if ((dtMonth==4 || dtMonth==6 || dtMonth==9 || dtMonth==11) && dtDay ==31) 
        return false;
    else if (dtMonth == 2) 
    {
        var isleap = (dtYear % 4 == 0 && (dtYear % 100 != 0 || dtYear % 400 == 0));
        if (dtDay> 29 || (dtDay ==29 && !isleap)) 
                return false;
    }
    return true;
}

我可以为此使用什么正则表达式模式来解释无效日期和闰年？

6个回答

我稍微扩展了上面发布的 isValidDate 函数 Thorbin（使用正则表达式）。我们使用正则表达式来检查格式（以防止我们获得对日期有效的另一种格式）。在这个松散的检查之后，我们实际上通过 Date 构造函数运行它，如果它在此格式中有效，则返回 true 或 false。如果它不是一个有效的日期，我们将从这个函数中得到错误。

function isValidDate(dateString) {
  var regEx = /^\d{4}-\d{2}-\d{2}$/;
  if(!dateString.match(regEx)) return false;  // Invalid format
  var d = new Date(dateString);
  var dNum = d.getTime();
  if(!dNum && dNum !== 0) return false; // NaN value, Invalid date
  return d.toISOString().slice(0,10) === dateString;
}


/* Example Uses */
console.log(isValidDate("0000-00-00"));  // false
console.log(isValidDate("2015-01-40"));  // false
console.log(isValidDate("2016-11-25"));  // true
console.log(isValidDate("1970-01-01"));  // true = epoch
console.log(isValidDate("2016-02-29"));  // true = leap day
console.log(isValidDate("2013-02-29"));  // false = not leap day

它是否适用于所有浏览器，因为Date构造函数在不同浏览器中的工作方式不同？
2021-04-21 16:50:01
它用于将有效日期合并为真值。 Invalid Date导致0when which is falsy（包括日期在内Invalid Date的日期是假的）。没有这个，你会得到类似的结果：!!(new Date('2016-11-25')) // true, !!(new Date('2016-11-50')) // true。有了这个，你会得到一些区分 2: !!(new Date('2016-11-50')|0) // false, 的东西!!(new Date('2016-11-25')|0) // true。该|运营商聚结日期为数字，truthy或falsey。
2021-04-24 16:50:01
从此函数（移动浏览器、IE 等...）收到错误：1）（IE）isNaN 不是函数 2）（SAFARI 异常）JS 错误：RangeError：**** 中的无效日期 toISOString@[native code ]
2021-04-25 16:50:01
这真的很好用，但为什么需要按位或？
2021-05-08 16:50:01
getTime为清楚起见，将其从使用按位 OR 修改为改为使用。@JacobRaccuia
2021-05-10 16:50:01

如果这对您来说足够了，您也可以使用正则表达式来完成稍微简单的工作（例如，如 [1] 中所见）。

它们内置于 javascript 中，因此您可以在没有任何库的情况下使用它们。 

function isValidDate(dateString) {
  var regEx = /^\d{4}-\d{2}-\d{2}$/;
  return dateString.match(regEx) != null;
}

将是一个函数来检查给定的字符串是否是四个数字 - 两个数字 - 两个数字（几乎是 yyyy-mm-dd）。但是您可以使用更复杂的表达式做更多的事情，例如检查 [2]。

isValidDate("23-03-2012") // false
isValidDate("1987-12-24") // true
isValidDate("22-03-1981") // false
isValidDate("0000-00-00") // true
如果日期允许，则为负 1 isValidDate("1987-24-24")
2021-05-11 16:50:01

由于 jQuery 被标记，这里有一种简单/用户友好的方法来验证必须是日期的字段（您将需要jQuery 验证插件）：

html

<form id="frm">
<input id="date_creation" name="date_creation" type="text" />
</form>

jQuery

$('#frm').validate({
  rules: {
    date_creation: {
      required: true,
      date: true
    }
  }
});

演示 + 示例

更新：经过一番挖掘，我没有发现任何可以设置特定日期格式的现成参数的证据。

但是，您可以在自定义规则中插入您选择的正则表达式 :)

$.validator.addMethod(
    "myDateFormat",
    function(value, element) {
        // yyyy-mm-dd
        var re = /^\d{4}-\d{1,2}-\d{1,2}$/;

        // valid if optional and empty OR if it passes the regex test
        return (this.optional(element) && value=="") || re.test(value);
    }
);

$('#frm').validate({
  rules: {
    date_creation: {
      // not optional
      required: true,
      // valid date
      date: true
    }
  }
});

这条新规则意味着对您的标记进行更新：

<input id="date_creation" name="date_creation" type="text" class="myDateFormat" />
我认为使用 jQuery 就好了，我只是想让你知道第二个解决方案可能有一些问题
2021-05-08 16:50:01
您自定义的正则表达式版本不会检查有效的数字范围，也会匹配“0000-00-00”之类的内容。您还可以使用更简单的纯 javascript 来实现这一点，但出于教育原因，这应该是 IMO 的首选。
2021-05-09 16:50:01
第一条规则确实检查有效的数字范围（测试 2000-44-23 ，返回无效）。我会更新我的答案，以便更清楚。当然，您可以使用纯 javascript 来完成此操作，但我认为 OP 了解使用 jQuery 功能的方法会很有趣。
2021-05-17 16:50:01

试试这个这是工作演示：

$(function() {
    $('#btnSubmit').bind('click', function(){
        var txtVal =  $('#txtDate').val();
        if(isDate(txtVal))
            alert('Valid Date');
        else
            alert('Invalid Date');
    });

function isDate(txtDate)
{
    var currVal = txtDate;
    if(currVal == '')
        return false;

    var rxDatePattern = /^(\d{4})(\/|-)(\d{1,2})(\/|-)(\d{1,2})$/; //Declare Regex
    var dtArray = currVal.match(rxDatePattern); // is format OK?

    if (dtArray == null) 
        return false;

    //Checks for mm/dd/yyyy format.
    dtMonth = dtArray[3];
    dtDay= dtArray[5];
    dtYear = dtArray[1];        

    if (dtMonth < 1 || dtMonth > 12) 
        return false;
    else if (dtDay < 1 || dtDay> 31) 
        return false;
    else if ((dtMonth==4 || dtMonth==6 || dtMonth==9 || dtMonth==11) && dtDay ==31) 
        return false;
    else if (dtMonth == 2) 
    {
        var isleap = (dtYear % 4 == 0 && (dtYear % 100 != 0 || dtYear % 400 == 0));
        if (dtDay> 29 || (dtDay ==29 && !isleap)) 
                return false;
    }
    return true;
}

});

改变的正则表达式是：

var rxDatePattern = /^(\d{4})(\/|-)(\d{1,2})(\/|-)(\d{1,2})$/; //Declare Regex
您错过了调用函数的绝佳机会valiDATE。就说人...
2021-05-02 16:50:01

我建议使用 Using jquery validation plugin 和 jquery ui date picker

jQuery.validator.addMethod("customDateValidator", function(value, element) {
// dd-mm-yyyy
   var re = /^([0]?[1-9]|[1|2][0-9]|[3][0|1])[./-]([0]?[1-9]|[1][0-2])[./-]([0-9]{4}|[0-9]{2})$/ ; 
   if (! re.test(value) ) return false
   // parseDate throws exception if the value is invalid
   try{jQuery.datepicker.parseDate( 'dd-mm-yy', value);return true ;}
   catch(e){return false;} 
   },
   "Please enter a valid date format dd-mm-yyyy"
);

this.ui.form.validate({
    debug: true,
    rules : {
    title : { required : true, minlength: 4 }, 
    date : { required: true, customDateValidator: true }
    }
}) ;

使用 Jquery 和日期选择器只需创建一个函数

// dd-mm-yyyy
var re = /^([0]?[1-9]|[1|2][0-9]|[3][0|1])[./-]([0]?[1-9]|[1][0-2])[./-]([0-9]{4}|[0-9]{2})$/ ; 
 if (! re.test(value) ) return false
// parseDate throws exception if the value is invalid
try{jQuery.datepicker.parseDate( 'dd-mm-yy', value);return true ;}
catch(e){return false;}

您可能只使用正则表达式进行验证 

// dd-mm-yyyy
var re = /^([0]?[1-9]|[1|2][0-9]|[3][0|1])[./-]([0]?[1-9]|[1][0-2])[./-]([0-9]{4}|[0-9]{2})$/ ; 
return re.test(value)

当然日期格式应该是你所在的地区

其它你可能感兴趣的问题
上一篇你如何在 Grunt.js 中观看多个文件，但只在更改的文件上运行任务？ 下一篇在不禁用滚动功能的情况下防止 iOS 弹跳