根据用户年龄

时间:2018-03-14 19:30:45

标签: javascript jquery forms

我正在尝试开发一些JS,它允许表单根据用户年龄更改提交的单选按钮的值。基本上,如果用户是13岁或更小并且选择了' 100'的radio1值,它应该改变' 100'一片空白。

以下是代码。无论我做什么,它似乎总是看到用户超过​​13岁。任何帮助表示赞赏!

var ofAge = "N"

function checkAge() {
  var monInput = document.querySelector("#i_date_of_birth_month").value
  var dayInput = document.querySelector("#i_date_of_birth_day").value
  var yearInput = document.querySelector("#i_date_of_birth_year").value
  var dateString = monInput + ", " + dayInput + ", " + yearInput
  var birthDate = new Date(dateString);
  var todayDate = new Date()
  var age = todayDate.getFullYear() - birthDate.getFullYear();
  var m = birthDate.getMonth() - todayDate.getMonth()
  if (m < 0) {
    age--
  }
  if (age > 13) {
    ofAge = "Y"
  } else if (age == 13) {
      var d = birthDate.getDate() - todayDate.getDate()
      if (d >= 0) {
        ofAge = "Y"
      } else {
        ofAge = "N"
      }
    }
  if (ofAge == "N") {
    document.querySelector("#radio1").value = ""
  } else {
    document.querySelector("#radio1").value = "100"
  }
}

document.getElementById("i_date_of_birth_day").addEventListener("change", checkAge)
document.getElementById("i_date_of_birth_year").addEventListener("change", checkAge)
document.getElementById("i_date_of_birth_month").addEventListener("change", checkAge)

3 个答案:

答案 0 :(得分:2)

如果年龄小于13,则需要添加else语句。

} else { ofAge = "N"; }

&#13;
&#13;
var ofAge = "N"

function checkAge() {
  var monInput = document.querySelector("#i_date_of_birth_month").value
  var dayInput = document.querySelector("#i_date_of_birth_day").value
  var yearInput = document.querySelector("#i_date_of_birth_year").value
  var dateString = monInput + ", " + dayInput + ", " + yearInput
  var birthDate = new Date(dateString);
  var todayDate = new Date()
  var age = todayDate.getFullYear() - birthDate.getFullYear();
  var m = birthDate.getMonth() - todayDate.getMonth()
  if (m < 0) {
    age--
  }
  age = parseFloat(age);
  if (age > 13) {
    ofAge = "Y"
  } else if (age == 13) {
    var d = birthDate.getDate() - todayDate.getDate()
    if (d >= 0) {
      ofAge = "Y"
    } else {
      ofAge = "N"
    }
  } else {
    ofAge = "N";
  }
  if (ofAge == "N") {
    document.querySelector("#radio1").value = ""
  } else {
    document.querySelector("#radio1").value = "100"
  }
}

document.getElementById("i_date_of_birth_day").addEventListener("change", checkAge)
document.getElementById("i_date_of_birth_year").addEventListener("change", checkAge)
document.getElementById("i_date_of_birth_month").addEventListener("change", checkAge)
&#13;
<input type="text" name="" id="i_date_of_birth_day">
<input type="text" name="" id="i_date_of_birth_month">
<input type="text" name="" id="i_date_of_birth_year">

<input type="radio" name="" id="radio1">
<input type="radio" name="" id="radio2">
&#13;
&#13;
&#13;

答案 1 :(得分:1)

您正在创建的日期字符串(使用逗号)的格式不正确。但最好直接设置日,月和年

  var monInput = document.querySelector("#i_date_of_birth_month").value
  var dayInput = document.querySelector("#i_date_of_birth_day").value
  var yearInput = document.querySelector("#i_date_of_birth_year").value

这是我相信你的问题。

  var dateString = monInput + ", " + dayInput + ", " + yearInput

相反,您应该创建一个默认的Date(),并使用setFullYear,setMonth(警告:javascript中的月份为0)和setDate

答案 2 :(得分:1)

@tech2017's answer的基础上,您还需要更改处理日期的方式。而不是逗号和空格,在每个字段之间使用连字符(-)来构建日期对象。

请参阅以下代码,了解@ tech2017的答案,以便正确构建日期。 console.log()来电就在那里,这样您就可以看到正在生成和更改的内容。

var ofAge = "N"

function checkAge() {
  var monInput = document.querySelector("#i_date_of_birth_month").value
  var dayInput = document.querySelector("#i_date_of_birth_day").value
  var yearInput = document.querySelector("#i_date_of_birth_year").value
  var dateString = monInput + "-" + dayInput + "-" + yearInput
  console.log("dateString: " + dateString);
  var birthDate = new Date(dateString);
  console.log("birthDate: " + birthDate);
  var todayDate = new Date()
  var age = todayDate.getFullYear() - birthDate.getFullYear();
  var m = birthDate.getMonth() - todayDate.getMonth()
  if (m < 0) {
    age--
  }
  age = parseFloat(age);
  if (age > 13) {
    ofAge = "Y"
  } else if (age == 13) {
    var d = birthDate.getDate() - todayDate.getDate()
    if (d >= 0) {
      ofAge = "Y"
    } else {
      ofAge = "N"
    }
  } else {
    ofAge = "N";
  }
  if (ofAge == "N") {
    document.querySelector("#radio1").value = ""
  } else {
    document.querySelector("#radio1").value = "100"
  }
  console.log("radio1 value = " + document.querySelector("#radio1").value);
}

document.getElementById("i_date_of_birth_day").addEventListener("change", checkAge)
document.getElementById("i_date_of_birth_year").addEventListener("change", checkAge)
document.getElementById("i_date_of_birth_month").addEventListener("change", checkAge)
<input type="text" name="" id="i_date_of_birth_day">
<input type="text" name="" id="i_date_of_birth_month">
<input type="text" name="" id="i_date_of_birth_year">

<input type="radio" name="" id="radio1">
<input type="radio" name="" id="radio2">