唯一の入力がmm-ddのテキストボックスに日付をyyyy-mm-ddにフォーマットJavaScript

Question

データを収集して保存するHTMLフォームに時間を節約しようとしています。

私の日付フィールドの場合、私は現在datepickerを使用していますが、入力しているデータの量があれば時間がかかります。

これを行うJavaScriptコードでdatepickerを置き換えたいと思います。

フィールドをタブ移動または入ると、テキストボックスへの入力I「5-25」が自動的に「2017年5月25日」

しかし、月はその後、以前の現在の月である場合（例えば、フォーマットたい場合現在1月、2月、3月または4月より早くなる場合）現在の年に1を加えたものを返すことをお勧めします。したがって、テキストボックスに3-26を入力した場合、2018-03- 26。

これを実行できる実際のJavaScriptコードをお手伝いできますか？

Answer 1

入力の場合はYYYY-MM-DDを使用するには、ほとんどが以外DMYを入力することを好む、ユーザーのために通常は不便ですmdyが好まれるいくつかの場所。

d-m-yを使用すると、部分的に書き込まれた日付の値を簡単に伝えることができます。例えば。今年は16/5が5月16日ですが、フォーマットがy-m-dならば、5-mが2005年でなければならないかどうかわかりません。

とにかく、yyyy-m-dに固執すると、最初の値が4桁の場合は1年と仮定できます。それが少ない場合は、それに続く1ヶ月です。だから、

：これは、任意の検証を行いません

function setDate() { 
 

 
    // Padding helper 
 
    function z(n) { 
 
    return (n < 10 ? '0' : '') + n 
 
    } 
 

 
    var today = new Date(); 
 
    var b = this.value.split(/\D/); 
 
    var year = today.getFullYear(); 
 

 
    // If only a 2 part date was entered, create full date and 
 
    // assume mm-dd. Otherwise do nothing 
 
    if (b.length < 3) { 
 
    year += b[0] <= today.getMonth()? 1 : 0; 
 
    this.value = year + '-' + z(+b[0]) + '-' + z(+b[1]) 
 

 
    // For other values, make sure the separator is '-'. 
 
    } else { 
 
    this.value = b.map(z).join('-'); 
 
    } 
 
} 
 

 
window.onload = function() { 
 
    var el = document.getElementById('aDate'); 
 
    if (el) { 
 
    el.addEventListener('blur', setDate, false); 
 
    } 
 
};

Enter a Date:<input id="aDate" name="aDate" placeholder="yyyy-mm-dd or mm-dd">

は、それを追加することができますが、おそらく別の関数でなければなりません。これは値をフォーマットするだけで、それを検証することができます。

ユーザーが任意の非桁区切り文字を使用できるように、少しの書式設定を追加しました。 3/26、3.26,3-26、または3 26など

Answer 2

私は疑問に打撃を与え、あなたの問題を解決し、簡単なjQueryのスクリプトを開発しました：

$(function() { 
    //Whenever you exit any input in your form 
    $("form input").on("blur", function() { 

     //Get the values on each side of the dash 
     var $date = $(this).val().split("-"); 

     //If the date is given in a wrong format 
     if ($date.length != 2) { 
      //Perhaps some error-handling code here 
      return; 
     } 

     var $today = new Date(); 
     $year = $today.getFullYear(); 

     //Trailing 0 formats 
     $month = ("0" + $date[0]).slice(-2); 
     $day = ("0" + $date[1]).slice(-2); 

     //If today is later (geater) than the given date 
     if ($today > new Date($year, $month-1, $day)) { 
      //Set the date format to a year later yyyy-mm-dd 
      $(this).val(($year+1) + "-" + $month + "-" + $day); 
     } else { 
      //Set the date to this year yyyy-mm-dd 
      $(this).val($year + "-" + $month + "-" + $day); 
     } 
    }); 
}); 
//5-10 gives 2018-05-10 
//5-11 gives 2017-05-11 
//4-10 gives 2018-04-10 
//6-10 gives 2017-06-10 
//0x-xx gives 201x-0x-xx (trailing zero can be excluded)