2016-08-20 112 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'); 
}