如何使用javascript/jquery设置年龄文本框的值

How to set value of age textbox by using javascript/jquery

本文关键字:文本 设置 何使用 javascript jquery      更新时间:2023-09-26

我有

<input type="text" name="age" value="" enabled="false">` paired with a `<input type="date" name="birthdate">

我想将年龄文本框值设置为当前日期和用户输入的日期之差,以使用 javascript 或 jquery 自动获取日期

如果您使用的是"vanilla"JS。然后,您可以解析在 DOB 中输入的日期。

function setAge(e){
  var bday = new Date(Date.parse(e.target.value));
  var today = new Date()
  document.getElementsByName('age')[0].value = today.getFullYear() - bday.getFullYear();
}

您可以为生日输入设置 onchange 事件。

<input type="date" name="birthdate" onchange="setAge(event)">

小提琴:https://jsfiddle.net/j4dotd9d/1/

希望对您有所帮助!

标记中进行两个小更改

<input type="text" name="age" value="" disabled="true" id="age"> //observe that i have replaced enabled=false  
<input type="date" name="birthdate" id="birthdate"> //observe that i have given an id attribute to it

现在,您可以将年龄以年份表示为

var date = new Date();
var birthdate = new Date( document.getElementById( "birthdate" ).value );
alert( "age is " + ( date.getFullYear() - birthdate.getFullYear() ) );

将此值设置为"期限"文本框

document.getElementById( "age" ).value = date.getFullYear() - birthdate.getFullYear() ;

一个更简单的jQuery版本将是

var date = new Date();
var birthdate = new Date( $( "#birthdate" ).val() );
var age = date.getFullYear() - birthdate.getFullYear();
$( "age" ).val( age ) ;

试试这个:您可以根据用户选择的出生日期更改来计算年龄。取时间差,然后计算年月。注意 - 计算的年份和月份是近似值,OP 应相应地更改代码。

$(function(){
  var calculateAge = function(time){
    var months = Math.round(time/(24*60*60*1000*30));
    //alert(months);
    var years = parseInt(months / 12);
    //alert(years);
    months = months % 12;
    return years +" yrs and " + months + " months";
  };
  $('input[name="birthdate"]').change(function(){
       var birthDate = new Date($(this).val()).getTime();
       var presentDate = new Date().getTime();
       //alert(birthDate);
       //alert(presentDate);
       var age = presentDate - birthDate;
       $('input[name="age"]').val(calculateAge(age));
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<input type="text" name="age" value="" enabled="false"> 
<br/>paired with a <input type="date" name="birthdate">

下面的代码只需使用年份即可工作,而不是月份和日期,请重写它

这是 HTML 代码

<input type="text" id="age" value=""/>
<input type="date" id="current" onchange="javaScript:age()"/>

这是javaScript

function age() {
var curr = document.getElementById('current').value;
var split = curr.split("-", 1);
var newsplit = parseInt(split);
var date = new Date();
var newcurr= parseInt(date.getFullYear());
var age = newcurr - newsplit;
document.getElementById('age').setAttribute('value', age);
}