2013-02-04 10 views
6

私はユーザが日付 - 時刻を入力するテキストフィールドを持っています:dd/mm/YYYY hh:ii。私はこれが有効な日時javascriptを使用しているかどうかをチェックしたいと思います。これには2月29日とすべてが含まれます。どうやってやるの?正規表現は特別な月のために成功しません。JSは有効な日付形式を確認します

+0

:http://jqueryui.com/datepicker/ – QuentinUK

+0

@RachelGallen答えとしてこれを提出してください 次のようないくつかのサンプルの入力を試すことができます。 QuentinUK:いいですが、私が求めたものではありません。 – Keelan

+0

@CamilStaps - 完了! –

答えて

3

http://internotredici.com/article/checkdateinjavascript/を参照すると、時間をチェックするのに役立つ記事が表示されます。以下

は、スクリプトの下で2006年1月31日に公開 記事は プログラマ非常に多くの場合、フォームに挿入された情報を検証するために、その正しさをチェックする必要があるJavaScriptで

チェック日付ではJavaScriptから有用なテイク利点である記事の全文であります。このチュートリアルでは、日付が有効かどうかを確認するためにjavascriptを使用する方法について説明します。 フォームの日付は、2つの異なる方法で挿入されます。最初のテキストフィールドは、異なるパターンに従ってユーザータイプデータを使用するテキストフィールドを使用します(このチュートリアルでは、日付はdd-mm-yyyy形式です)。もう1つはプルダウンメニューを使用します。最初の解決策は実行が簡単ですが、ユーザーによって誤ったエラーが発生する可能性があります(たとえば、無効な文字を挿入する、または計画された形式とは異なる形式で頻繁に入力するなど)。

:我々はcheck_form機能を使用する挿入されたデータの正しさを確認するには

<form id="test_form" action="get" method="/checkdatejavascript" 
onsubmit="return(check_form(this)); return false;"> 
<input type="text" name="datefield" id="datefield" /> 
</form> 

: は今、我々はDD-MM-yyyyの形式で日付を挿入する、次のテキストフィールドを持っていると仮定します

function check_form() 
{ 
// Regular expression used to check if date is in correct format 
var pattern = new RegExp([0-3][0-9]-(0|1)[0-9]-(19|20)[0-9]{2}); 
if(document.getElementById('datefield').value.match(pattern)) 
{ 
    var date_array = document.getElementById('datefield') 
        .value.split('-'); 
    var day = date_array[0]; 

    // Attention! Javascript consider months in the range 0 - 11 
    var month = date_array[1] - 1; 
    var year = date_array[2]; 

    // This instruction will create a date object 
    source_date = new Date(year,month,day); 

    if(year != source_date.getFullYear()) 
    { 
    alert('Year is not valid!'); 
    return false; 
    } 

    if(month != source_date.getMonth()) 
    { 
    alert('Month is not valid!'); 
    return false; 
    } 

    if(day != source_date.getDate()) 
    { 
    alert('Day is not valid!'); 
    return false; 
    } 
} 
else 
{ 
    alert('Date format is not valid!'); 
    return false; 
} 

return true; 

} 青色で示された正規表現は、挿入された日付がデフォルトの割り当てられた形式に従うかどうかを制御するために使用されます。パターンが有効であれば、関数は次のステップに進みます。それ以外の場合はエラーメッセージが送出されます。abdフォームは送信されません(正規表現では日付が空でないことが保証されます)。 日付を検証するために、javascriptによって提供されるDateオブジェクトを使用します。 (赤で示されているコードを確認してください)。アルゴリズムはかなりシンプルです。ユーザーが挿入した情報を使用して、Dateオブジェクトを作成し、getFullYear、getMonth、およびgetDateメソッドを使用して、年、月、および日をそれぞれ表す3つの値を生成します。これらの値がユーザーが挿入した値と等しい場合、日付は正しいです。今すぐ次の例を考えてみましょう:テキストフィールドに

ユーザーの挿入文字列から作成された文字列1976年9月1日 Dateオブジェクトは、1976年9月1日 日付がテキストフィールドに

有効なユーザーの挿入文字列31であります文字列から作成された-02-2006 Dateオブジェクトは、2006年3月3日 日は、プログラマーが数ヶ月が考慮されているので、日付を処理するJavaScriptの方法で(緑で証明コードを確認してください)特に注意を取らなければならなかった

有効ではありませんoが1月、11が12月であると仮定して、0〜11の範囲で指定します。

<form id="test_form" action="get" method="/checkdatejavascript" 
    onsubmit="return(check_form(this)); return false;"> 
    <select name="dateday" id="dateday"> 
    <option value="1">1</option> 
    […] 
    </select> 
    <select name="datemonth" id="datemonth"> 
    <option value="0">January</option> 
    […] 
    </select> 
    <select name="dateyear" id="dateyear"> 
    <option value="2006">2006</option> 
    […] 
    </select> 
    </form> 

日付の正しさをcontrollするJavaScript関数が

です:プルダウンメニューの場合 は正規表現が日付フォーマットを検証する必要がされていないという事実にコントロールがより簡単であり、日付を挿入するために使用されています
function check_form() 
{ 
var day = document.getElementById('dateday').value; 
var month = document.getElementById('datemonth').value; 
var year = document.getElementById('dateyear').value; 

// This instruction will create a date object 
source_date = new Date(year,month,day); 

if(year != source_date.getFullYear()) 
{ 
    alert('Year is not valid!'); 
    return false; 
} 

if(month != source_date.getMonth()) 
{ 
    alert('Month is not valid!'); 
    return false; 
} 

if(day != source_date.getDate()) 
{ 
    alert('Day is not valid!'); 
    return false; 
} 

return true; 
} 

更新:正規表現に問題があったため、コードを更新しました。アドバイスありがとうございます。

+0

リンクがダウンすると、この回答は役に立ちません。 – Mathletics

+0

@Mathletics私はフルコードで答えを更新しました。 –

2

moment.jsがOKの場合は、http://momentjs.com/docs/#/parsing/string-format/に日付/時刻解析ユーティリティをチェックすることができます。あなたは、次の機能を使用することができ、他の外部ライブラリを使用したくない場合は

moment("29/02/2014 11:45", "DD/MM/YYYY hh:mm", true).isValid() 
1

:たとえば

var validateDate = function(dateTime){ 
    var f_date = dateTime.split(" ")[0].split("/").reverse().join("/"); 
    var time = dateTime.split(" ")[1]; 

    var date = dateTime.split(" ")[0].split("/").map(function(c, i, a){ 
     return parseInt(c); 
    }); 
    var daysInMonth = [31,28,31,30,31,30,31,31,30,31,30,31]; 
    if ((!(date[2] % 4) && date[2] % 100) || !(date[2] % 400)) { 
    console.log("inside"); 
    daysInMonth[1] = 29; 
    } 

    if(date[0] > 0 && (date[0] <= daysInMonth[(date[1]-1)]) && date[1] > 0 && date[1] <= 12){ 
    return new Date(f_date + " " + time) != "Invalid Date"; 
    } 
    return false; 
} 

をこれも、うるう年の変化の世話をします。この関数は、入力がdd/mm/YYYY hh:iiの形式である場合にのみ機能します。あなたはjQueryのを使用している場合は表示さ

validateDate("29/2/2000 12:30"); // Should return true 
validateDate("29/2/2001 12:30"); // Should return false 
validateDate("32/8/2000 12:30"); // Should return false 
validateDate("30/11/2000 12:30"); // Should return true 
validateDate("31/4/2000 12:30"); // Should return false 
validateDate("15/7/2000 12:77"); // Should return false 
関連する問題