Jqueryでdatepicker形式を厳密に検証する方法は？

Question

私は、フォーマットがdd-mm-yyyyのdatepickerを使用しています。しかし、問題は、誰かが他の形式で日付を入力すると、それが受け入れられることです。たとえば、誰かがyyyy-dd-mmまたはmm-dd-yyyyまたはyyyy-mm-ddなどの日付を入力すると、それが受け入れられます。

jQueryの機能私は上記のコードは、あなたのためだけの基本的な考え方であるが -

$(function() { 
 
\t $('#date').datepick({dateFormat: 'dd-mm-yyyy'}); 
 
});

<input type="text" name="date" id="date" />

を使用しています。

誰かがdd-mm-yyyy以外の形式で日付を入力した場合は、警告を表示してそのテキストボックスに注目する必要があります。私たちはこれをどのように達成できますか？

Answer 1

<input type="text" name="date" id="date" /> 

このフィールドを正確に使用しようとしているかどうかはわかりませんが、次のHTML5要素が目的を果たし、JSまたはライブラリを必要としません。

<input type="date" name="date" id="date" /> 

テキストを日付から日付にスワップします。

UPDATE

あなたは正規表現を使用して値の形式を確認するためにjqueryのを使用することができます。

$(function() { 
 
\t $('#date').datepick({dateFormat: 'dd-mm-yyyy'}); 
 
}); 
 

 
$('#date').on('change', function() { 
 
    var givenValue = $('#date').val(); 
 
    if(!isValidDate(givenValue)){ 
 
     $('#date').val(""); 
 
     $("<p>Invalid</p>").insertAfter("#date"); 
 
    } else { 
 
     $("<p>Valid</p>").insertAfter("#date"); 
 
    } 
 
}); 
 

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="date" id="date" />

あなたは、あなたが:)