2016-08-20 73 views
0

這裏我想對輸入的當前日期和日期進行比較。日期格式化和比較Javascript

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#date").change(function(){ 
      var realDate = new Date(); 
      var startDate = new Date($('#date').val()); 
      if (realDate >= startDate) { 
       $('#infobros').removeClass('hidden'); 
      }else{ 
       $('#infobros').addClass('hidden'); 
      } 
     }); 
    }); 
function validateForm(){ 
    var realDate = new Date(); 
    var startDate = new Date($('#date').val()); 

    if (realDate >= startDate){ 
     alert('Please Change your date Start'); 
     $('#date').focus(); 
     return false; 
    } 
    } 
</script> 

在那裏,我想我的ID #infobors刪除類hidden當我輸入startDate其低比我realDate或者startDate相同或比realDate以上。

但是,現在如果我輸入相同的日期到當前日期#infobros仍在執行。

BTW:我的格式的startDate = YYYY-MM-DD

,但我不知道我的realDate

我希望有人能幫助我,使我的劇本是工作的格式..

BTW:這是我的格式realDate:

photo

有人可以幫我換到:YYYY-MM-DD

+0

'警報(realDate)',看看你的realDate的格式比較日期試試這個http://stackoverflow.com/問題/ 3004178 /如何比較兩個日期值與jQuery –

+0

在控制檯中檢查您的日期。 'console.log(realDate,'realDate'); console.log(startDate,'startDate'); console.log(realDate> = startDate,'是ture?');' – Grund

+0

也許嘗試''但是這會改變你的輸入格式 – Grund

回答

0

您的日期應作儀工作,如果輸入的日期是正確的,最好使用一些輸入小部件的日期或輸入類型=「日期」。我通過更改您的代碼創建了工作示例。

/** 
*Function checks date is in past or future 
*/ 
function checkDate(){ 

    var realDate = new Date(); 
    var startDate = new Date($('#date').val()); 
    if (realDate >= startDate) { 
     $('#infobros').removeClass('hidden'); 
     return false;//date in past 
    }else{ 
     $('#infobros').addClass('hidden'); 
     return true;//date in future 
    } 
} 

function validateForm(e){ 

    //use it on submit 
    if (checkDate()){ 
     return true; //here date is in future so ok 
    } 
    else 
     { 
      e.preventDefault(); //stop submitting form 
      alert("You date should be future date"); 
      return false; 
     } 
} 


$(document).ready(function(){ 
    $("#date").change(function(){ 

     checkDate();//use it on change 

    }); 

    $("form").submit(validateForm);//set on submit event 

    checkDate();//use it after start of page 
}); 

這裏是在plunker工作代碼 - https://plnkr.co/edit/fGGgHSiYcG1gqugLRToX?p=preview

+0

ahh oke,但警報如何?它不應該彈出時,我輸入相同的日期 –

+0

你在你的代碼realDate> = startDate所以它也意味着==。你想提醒沒有顯示日期是否等於?如果是這樣我會改變代碼,但我必須知道這是你需要的。 –

+0

要在相同的日期不顯示提醒change> = to> in if statemant –

0

這是我寫的一個dateUtility函數。我知道它裏面有許多漏洞,因爲它被其他代碼所包圍,但它給了你很多你需要的東西。它甚至照顧閏年和5個國際日期模式!

function setDateComponents(regularExpressionResultsArray){ 
    if (this.dateUtilDatePattern == "M/d/yyyy" || this.dateUtilDatePattern == "MM/dd/yyyy") { 
     this.month = parseInt(eliminateLeadingZero(regularExpressionResultsArray[ 1 ])) -1; 
     this.day = parseInt(eliminateLeadingZero(regularExpressionResultsArray[ 2 ])); 
     this.year = parseInt(regularExpressionResultsArray[ 3 ]); 
     return; 
    } 

    if (this.dateUtilDatePattern == "d/M/yyyy" || this.dateUtilDatePattern == "dd/MM/yyyy") { 
     this.day = parseInt(eliminateLeadingZero(regularExpressionResultsArray[ 1 ])); 
     this.month = parseInt(eliminateLeadingZero(regularExpressionResultsArray[ 2 ])) - 1; 
     this.year = parseInt(regularExpressionResultsArray[ 3 ]); 
     return; 
    } 

    if (this.dateUtilDatePattern == "d.M.yyyy" || this.dateUtilDatePattern == "dd.MM.yyyy") { 
     this.day = parseInt(eliminateLeadingZero(regularExpressionResultsArray[ 1 ])); 
     this.month = parseInt(eliminateLeadingZero(regularExpressionResultsArray[ 2 ])) - 1; 
     this.year = parseInt(regularExpressionResultsArray[ 3 ]); 
     return; 
    } 

    alert("Date utility. Date pattern not implemented " + this.dateUtilDatePattern); 
} 

function defineRegularExpression(){ 
    if ((this.dateUtilDatePattern == "M/d/yyyy") || 
     (this.dateUtilDatePattern == "d/M/yyyy") || 
     (this.dateUtilDatePattern == "dd/MM/yyyy") || 
     (this.dateUtilDatePattern == "MM/dd/yyyy")) { 
     this.separator = "/"; 
     this.regExp = /^([0-9]{1,2})\/([0-9]{1,2})\/(\d\d\d\d)$/; 
     return; 
    } 
    if ((this.dateUtilDatePattern == "d.M.yyyy") || 
     (this.dateUtilDatePattern == "dd.MM.yyyy")) { 
     this.separator = "."; 
     this.regExp = /^([0-9]{1,2})\.([0-9]{1,2})\.(\d\d\d\d)$/; 
     return; 
    } 

    alert("Date utility. Date pattern not implemented " + this.dateUtilDatePattern); 
} 


function generateDateObject(dateAsString){ 

    // assert if the pattern matches 
    if(dateAsString.search(this.regExp) == -1){ 
     throw new DateUtilityException(this.ERROR_NOT_A_DATE); 
    } 

    // parse the string 
    var regularExpressionResultsArray = this.regExp.exec(dateAsString); 

    // set date components for datePattern 
    this.setDateComponents(regularExpressionResultsArray); 
    // Create the date object, and validate numbers are reasonable 
    if((-1 < this.month) && (this.month < 12)) { 
     if((0 < this.day) && (this.day < 32)) { 
      var goodDate = performThoroughComponentAnalysis(this.month,this.day,this.year); 
      if (goodDate) {     
       this.dateObject = new Date(new Number(this.year), new Number(this.month), new Number(this.day));           
       // standardize the format 
       this.generateStandardizedDateAsStringAndDateComponents(); 
       return true; 
      } 
     } 
    } 
    throw new DateUtilityException(this.ERROR_NOT_A_DATE); 
} 

function performThoroughComponentAnalysis(month,day,year) { 
    var monthB1 = month + 1; //Use month range 1-12 

    // FEB 
    if (monthB1 == 2) { 
     // determine if leap year 
     var div4 = false; 
     var div100 = false; 
     var div400 = false; 
     var leapyear = false; 
     if ((year % 4) == 0) { 
      div4 = true; 
     }    
     if ((year % 100) == 0) { 
      div100 = true; 
     } 
     if ((year % 400) == 0) { 
      div400 = true; 
     } 

     if (div4) { 
      leapyear=true; 
      if ((div100)&&(!div400)) { 
       leapyear=false; 
      } 
     } 

     if (leapyear) { 
      if (day > 29) { 
       return false; 
      } 
     } 
     else { 
      if (day > 28) { 
       return false; 
      } 
     } 
    } 

    // 31 day months  
    if ((monthB1 == 1)||(monthB1 == 3)||(monthB1 == 5)||(monthB1 == 7)||(monthB1 == 8)||(monthB1 == 10)||(monthB1 == 12)) { 
     if (day > 31) { 
      return false; 
     } 
    } 

    // 30 day months 
    if ((monthB1 == 4)||(monthB1 == 6)||(monthB1 == 9)||(monthB1 == 11)) { 
     if (day > 30) { 
      return false; 
     } 
    } 
    return true; 
} 
+0

順便說一句。世界上的用戶不會進入YYYY-MM-DD。我建議使用代碼中的5個之一。 – javaMoca

+0

其oke,在那裏我使用datepicker,所以他們只需要選擇它,但謝謝你的建議 –

+0

不,不,如果我們有正確的日期格式,那麼日期對象comparission將沒有這種組合。如果我們需要更好的東西,請使用http://momentjs.com/ –

0

如果你要求的是如何比較日期則其

if(realDate.getTime() >= startDate.getTime()) { 
    $('#infobros').removeClass('hidden'); 
}else{ 
    $('#infobros').addClass('hidden'); 
}