根据datetimepicker选择的日期计算年龄

最新推荐文章于 2024-07-01 15:44:31 发布

ljw_Josie

最新推荐文章于 2024-07-01 15:44:31 发布

阅读量2.3k

点赞数 1

分类专栏：要好好学jQuery web前端取经路上

本文链接：https://blog.csdn.net/ljw_josie/article/details/70150464

版权

web前端取经路上同时被 2 个专栏收录

30 篇文章 0 订阅

订阅专栏

要好好学jQuery

3 篇文章 0 订阅

订阅专栏

首先上图看一下实现的效果：

html：（切记input加上value）

    <div class="form-group">
      <div class="col-md-4 control-label">
        <label>出生日期：</label>
      </div>
      <div class="controls col-md-5">
        <input class="form-control calendar-item" name="birthday" type="text" id="birthday" value={{ activityMember.birthday|date('Y-m-d') }} readonly="true">
        <i class="es-icon es-icon-calendar text-xlg"></i>
      </div>
      <div class="text-left color-gray">
        <span class="mlm">年龄：</span><input class="js-get-age" type="text" name="age" value=""readonly="true">      
      </div>
    </div>

js:

  $('#birthday').change(function(){
    var strBirthday = $('#birthday').val();
    $('.js-get-age').val(jsGetAge(strBirthday));
  })


  function jsGetAge(strBirthday){         
    var returnAge;  
    var strBirthdayArr=strBirthday.split("-");  
    var birthYear = strBirthdayArr[0];  
    var birthMonth = strBirthdayArr[1];  
    var birthDay = strBirthdayArr[2];  
      
    d = new Date();  
    var nowYear = d.getFullYear();  
    var nowMonth = d.getMonth() + 1;  
    var nowDay = d.getDate();  
      
    if(nowYear == birthYear){  
      returnAge = 0;//同年 则为0岁  
    }  
    else{  
      var ageDiff = nowYear - birthYear ; //年之差  
      if(ageDiff > 0){  
        if(nowMonth == birthMonth) {  
          var dayDiff = nowDay - birthDay;//日之差  
          if(dayDiff < 0)  
          {  
            returnAge = ageDiff - 1;  
          }  
          else  
          {  
            returnAge = ageDiff ;  
          }
        }  
        else  
        {  
          var monthDiff = nowMonth - birthMonth;//月之差  
          if(monthDiff < 0)  
          {  
            returnAge = ageDiff - 1;  
          }  
          else  
          {  
            returnAge = ageDiff ;  
          }  
        }  
      }  
      else  
      {  
        returnAge = -1;//返回-1 表示出生日期输入错误 晚于今天  
      }  
    }    
    return returnAge;//返回周岁年龄     
  }

总结一下就是：

1，给datepicker加一个change事件；

2，执行计算年龄的function；

3，将返回的周岁数赋给要输出的标签里面。