Как получить значение в JavaScript из трех разных выберите

Question

Я пытаюсь автоматически рассчитать возраст, когда пользователь выбирает дату своего рождения с тремя различными выпадающими списками, которые мне нужны для моей функции, чтобы получить эти три значения из трех выбранных разностей.Я могу сделать это только с одним выбором, но я не могу найти хорошее решение со многими выбора.Мне нужно 3 значения для последней строки (x, y, z). Скажите, пожалуйста, в чем проблема с моим кодом JavaScript.

С Новым годом всех!

$(document).ready(function calage() {

var year = document.getElementById("year" );
 var x = select.options[select.selectedIndex].value;
var month = document.getElementById("month" );
 var y = select.options[select.selectedIndex].value;
var day = document.getElementById("day" );
var z = select.options[select.selectedIndex].value;


var calculate_age = (function (){
"use strict";

return function(date_start){
var date_end = new Date(), date_end_time = date_end.getTime(),      date_start_time = date_start.getTime(), diff = (date_end_time-date_start_time)/(1000*60*60*24);
 return Math.floor(diff/365+1);
 };

 })();

 document.getElementById('age').value=(calculate_age(new Date(x, y,z)));
 });

И этомой HTML с ввода и выберите раскрывающийся список (упрощенно)

   <input id="age" name="age" type="text" disabled="disabled"  style="float: right;">

  <select name="day" id="day">
      <option value="empty" disabled selected>le</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
     </select>


  <select name="month" id="month">
      <option value="empty" disabled selected>le</option>
      <option value="jan">january</option>
      <option value="feb">2febrary</option>
      <option value="mar">march</option>
      <option value="apr">april</option>
     </select>


  <select onchange="calage() name="year" id="year">
      <option value="empty" disabled selected>le</option>
      <option value="1950">1950</option>
      <option value="1951">1951</option>
      <option value="1952">1952</option>
      <option value="1953">1953</option>
     </select>

Answer 1

Это то, что я придумал.Я надеюсь, что это имеет смысл.Некоторые изменения были косметическими.Основное изменение состоит в том, что вместо select.options... я заменил select на year, month и day для их соответствующих строк.См. Фрагмент ниже.

var calculate_age = function(date_start){
    var date_end = new Date(), date_end_time = date_end.getTime();
    var date_start_time = date_start.getTime();
    var diff = (date_end_time - date_start_time)/(1000*60*60*24);
    return Math.floor(diff/365+1);
};

function calage() {
    console.log('in calage')
    var year = document.getElementById("year" );
    var x = year.options[year.selectedIndex].value;
    var month = document.getElementById("month" );
    var y = month.options[month.selectedIndex].value;
    var day = document.getElementById("day" );
    var z = day.options[day.selectedIndex].value;

    if (x !== 'empty' && y !== 'empty' && z !== 'empty') {
        console.log('x: ', x);
        console.log('y: ', y);
        console.log('z: ', z);
        document.getElementById('age').value=(calculate_age(new Date(x, y, z)));
    }
}

$(document).ready(calage);

Другое существенное изменение заключается в том, что значение для месяцев необходимо заменить на числа вместо коротких имен.Итак, 0, 1, 2... вместо jan, feb, mar, потому что конструктор new Date() ожидает числа.

Итак, чтобы подвести итог, как уже упоминалось выше David Thomas, вы неоднократно использовали необъявленную переменную select для каждого иззначения, установленные компонентами select.Вы даже не использовали значения, которые вы устанавливали в year, month и day

. Вот кодовая ручка для рабочего примера.

Answer 2

    calage = ()=>{
        let x = getValue("day");
        let y = getValue("month");
        let z = getValue("year");

        console.log(`${x} , ${y}, ${z}`);
    }

    getValue = (targetName)=>{
        return document.getElementById(targetName).value;
    }

Вы также не закрыли "" в свойстве "onchange".