Javascript Jquery Select的功能是在生日时自动老化,而不是输入日期类型

Javascript Jquery Select的功能是在生日时自动老化,而不是输入日期类型,javascript,jquery,html,Javascript,Jquery,Html,当用户选择月、日和年时,如何进行自动计算年龄。我有一个自动计算年龄的代码。但是我想要的不是输入而是数据。请帮助我解决此问题:( 这是我的输入类型=“日期” 这是我的建议 请帮助我将其转换为如下所示的选择 <select class="form-control" id="dob-month"> <option value="0">Month</option> <option value="January">January</o

当用户选择月、日和年时,如何进行自动计算年龄。我有一个自动计算年龄的代码。但是我想要的不是输入而是数据。请帮助我解决此问题:(

这是我的输入类型=“日期”

这是我的建议

请帮助我将其转换为如下所示的选择

<select class="form-control" id="dob-month">
    <option value="0">Month</option>
    <option value="January">January</option>
    ...
</select>

<select class="form-control" id="dob-day">
    <option value="0">Day</option>
    <option value="1">1</option>
    ...
</select>

<select name="b2byear" class="form-control col-sm-3" id="dob-year">
    <option value="0">Year</option>
    <option value="2004">2004</option>
    <option value="2003">2003</option>
    ...
</select>

月
一月
...
白天
1.
...
年
2004
2003
...
它将在这里自动计算:

 <input type="text" class="form-control" placeholder="Age" disabled id="age" name="age">

试试这个

这里是。我为您的每个
选择添加了
。有关详细说明,请参阅内联注释

$('.year,.month,.day').on('change',function(){ //call change function on all 3 select dropdowns
    var selectedYear=$('.year').find('option:selected').val();//get selected year
    var selectedDay=$('.day').find('option:selected').val();//get selected day
    var selectedMonth=$('.month').find('option:selected').val(); //get selected month
    if(selectedYear!=0 && selectedMonth!=0 && selectedDay!=0) //check if all the 3 dropdown values are selected
    {
        var today = new Date();
        var dob=new Date(selectedDay+"/"+selectedMonth+"/"+selectedYear); //convert to a valid date
        var age = new Date(today - dob).getFullYear() -1970; //calculate age
        $("#age").val(age);//display it
    }
})

更新

的更改很少:

$('.year,.month,.day').on('change',function(){
    var selectedYear=$('.year').find('option:selected').val();
    var selectedDay=$('.day').find('option:selected').val();
    var selectedMonth=$('.month').find('option:selected').val();
    if(selectedYear!=0 && selectedMonth!=0 && selectedDay!=0)
    {
        var today = new Date();
        var dob=new Date(selectedDay+"/"+selectedMonth+"/"+selectedYear);
        var age = today.getFullYear() - dob.getFullYear();//just get it directly here
        $("#age").val(age);
    }
})

使用更新2

$('.year,.month,.day').on('change',function(){

    var selectedYear=$('.year').find('option:selected').val();
    var selectedDay=$('.day').find('option:selected').val();
    var selectedMonth=$('.month').find('option:selected').val();
    if(selectedYear!=0 && selectedMonth!=0 && selectedDay!=0)
    {
        var today = new Date();
        var dob=new Date(selectedYear,(selectedMonth-1),selectedDay); //convert to date in this format
        var age = today.getFullYear() - dob.getFullYear();//just get it directly here
        $("#age").val(age);
    }

})

使用更新3

$('.year,.month,.day').on('change',function(){

    var selectedYear=$('.year').find('option:selected').val();
    var selectedDay=$('.day').find('option:selected').val();
    var selectedMonth=$('.month').find('option:selected').val();
    if(selectedYear!=0 && selectedMonth!=0 && selectedDay!=0)
    {
        var today = new Date();
        var dob=new Date(selectedYear,(selectedMonth-1),selectedDay); //convert to date in this format
        var age = today.getFullYear() - dob.getFullYear();//just get it directly here
        $("#age").val(age);
    }

})
表单的HTML标准似乎允许禁用输入 元素不构成表单名称/值集合

因此,您将无法捕获禁用字段的值,我建议您不要将输入字段设置为
禁用
将其设置为
只读
,并向其添加一个类,使其感觉
禁用
,添加一些样式如下:

CSS

.readoly{
    color:darkgray;
    background-color: rgb(235, 235, 228);
    border:1px solid !important;
}

上帝保佑,非常感谢,先生。我将把这一年加起来,直到1920年:DGreat!!快乐编码:)@truelogicINC。。在代码中使用新计算更新答案!!检查一下!!先生,我在这里遇到了一个问题,先生,当我选择13、17等时。它说:nAN:(虽然您的任务相对较小,并且您可能对使用外部库不感兴趣。我为那些有类似事情要做的人发表评论,但他们必须在多个地方多次使用。尝试此库:
$('.year,.month,.day').on('change',function(){

    var selectedYear=$('.year').find('option:selected').val();
    var selectedDay=$('.day').find('option:selected').val();
    var selectedMonth=$('.month').find('option:selected').val();
    if(selectedYear!=0 && selectedMonth!=0 && selectedDay!=0)
    {
        var today = new Date();
        var dob=new Date(selectedYear,(selectedMonth-1),selectedDay); //convert to date in this format
        var age = today.getFullYear() - dob.getFullYear();//just get it directly here
        $("#age").val(age);
    }

})
.readoly{
    color:darkgray;
    background-color: rgb(235, 235, 228);
    border:1px solid !important;
}