如何使用 jquery 驗證這種格式 (yyyy-mm-dd) 的日期？

Question

我正在嘗試以這種格式驗證日期：（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;
}

我可以為此使用什么正則表達式模式來解釋無效日期和閏年？

Answer 1

我稍微擴展了上面發布的 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

Answer 2

如果這對您來說足夠了，您也可以使用正則表達式來完成稍微簡單的工作（例如，如 [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] Javascript - 正則表達式來驗證日期格式
• [2] http://www.regular-expressions.info/dates.html

Answer 3

由於 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" />

Answer 4

試試這個這是工作演示：

$(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

Answer 5

我建議使用 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) 

當然日期格式應該是你所在的地區

Answer 6

這是 YYYY-MM-DD 格式的 JavaScript rejex

/([12]\\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01]))/

Answer 7

 moment(dateString, 'YYYY-MM-DD', true).isValid() ||
 moment(dateString, 'YYYY-M-DD', true).isValid() ||
 moment(dateString, 'YYYY-MM-D', true).isValid();

Answer 8

只需使用Date構造函數與字符串輸入進行比較：

 function isDate(str) { return 'string' === typeof str && (dt = new Date(str)) && !isNaN(dt) && str === dt.toISOString().substr(0, 10); } console.log(isDate("2018-08-09")); console.log(isDate("2008-23-03")); console.log(isDate("0000-00-00")); console.log(isDate("2002-02-29")); console.log(isDate("2004-02-29"));

編輯：回應其中一條評論

嗨，它在 IE8 上不起作用你有解決方案嗎 – Mehdi Jalal

 function pad(n) { return (10 > n ? ('0' + n) : (n)); } function isDate(str) { if ('string' !== typeof str || !/\\d{4}\\-\\d{2}\\-\\d{2}/.test(str)) { return false; } var dt = new Date(str.replace(/\\-/g, '/')); return dt && !isNaN(dt) && 0 === str.localeCompare([dt.getFullYear(), pad(1 + dt.getMonth()), pad(dt.getDate())].join('-')); } console.log(isDate("2018-08-09")); console.log(isDate("2008-23-03")); console.log(isDate("0000-00-00")); console.log(isDate("2002-02-29")); console.log(isDate("2004-02-29"));

Answer 9

將正則表達式重新排列為：

/^(\d{4})([\/-])(\d{1,2})\2(\d{1,2})$/

我所做的不僅僅是重新排列條款，我還做了它，以便它不會接受像yyyy-mm/dd這樣的“破碎”日期。

之后，您需要調整您的dtMonth等變量，如下所示：

dtYear = dtArray[1];
dtMonth = dtArray[3];
dtDay = dtArray[4];

之后，代碼應該可以正常工作。

Answer 10

工作演示小提琴在這里演示

將您的驗證功能更改為此

function isDate(txtDate)
{
return txtDate.match(/^d\d?\/\d\d?\/\d\d\d\d$/);
}

Answer 11

您可以使用這個用於 YYYY-MM-DD。 它檢查它是否是有效日期以及該值是否為 NULL。 如果一切都檢查正確，則返回TRUE ，如果任何內容無效，則返回FALSE 。 沒有比這更容易的了！

function validateDate(date) {
    var matches = /^(\d{4})[-\/](\d{2})[-\/](\d{2})$/.exec(date);
    if (matches == null) return false;
    var d = matches[3];
    var m = matches[2] - 1;
    var y = matches[1] ;
    var composedDate = new Date(y, m, d);
    return composedDate.getDate() == d &&
            composedDate.getMonth() == m &&
            composedDate.getFullYear() == y;
}

請注意，月份需要像這樣減去： var m = matches[2] - 1; 否則將無法正確制作new Date()實例。