如何从一个下拉/选择菜单比较两个不同的值，并将其应用到一个条件语句作为一个价值？

Question

我试图做一个小计算器，询问他们的出生月份和日期的用户，并让他们根据他们选择的值占星术的迹象。我只是不太清楚如何将两个值合并为一个，这样我可以把它分配给一个变量。

JS：

    function getSelectValues() {
    var selectedMonth = document.getElementById("month").value;
    var selectedDate = document.getElementById("date").value;
    return selectedMonth + selectedDate;
}

getSelectValues();

HTML：

    <form id="birthday">
<select id="month">
    <option value=""></option>
    <option value="January">January</option>
    <option value="February">February</option>
    <option value="March">March</option>
    <option value="April">April</option>
    <option value="May">May</option>
    <option value="June">June</option>
    <option value="July">July</option>
    <option value="August">August</option>
    <option value="September">September</option>
    <option value="October">October</option>
    <option value="November">November</option>
    <option value="December">December</option>
</select>

<select id="date">
    <option value=""></option>
    <option value="1st">1</option>
    <option value="2nd">2</option>
    <option value="3rd">3</option>
    <option value="4th">4</option>
    <option value="5th">5</option>
    <option value="6th">6</option>
    <option value="7th">7</option>
    <option value="8th">8</option>
    <option value="9th">9</option>
    <option value="10th">10</option>
    <option value="11th">12</option>
    <option value="12th">12</option>
    <option value="13th">13</option>
    <option value="14th">14</option>
    <option value="15th">15</option>
    <option value="16th">16</option>
    <option value="17th">17</option>
    <option value="18th">18</option>
    <option value="19th">19</option>
    <option value="20th">20</option>
    <option value="21st">21</option>
    <option value="22nd">22</option>
    <option value="23rd">23</option>
    <option value="24th">24</option>
    <option value="25th">25</option>
    <option value="26th">26</option>
    <option value="27th">27</option>    
    <option value="28th">28</option>
    <option value="29th">29</option>
    <option value="30th">30</option>
    <option value="31st">31</option>
</select>

<input type="submit" id="button" value="Go"></input>

Answer 1

这看起来在selectedIndex为天/月的值，然后检查他们对白羊座的标志范围作为一个例子。请记住，在JavaScript的日期一月份为0而不是1。

function getSelectValues() {
  var selectedMonth = document.getElementById("month").selectedIndex - 1;
  var selectedDate = document.getElementById("date").selectedIndex;
  var d = new Date(0000, selectedMonth, selectedDate);
  var ariesStr = new Date(0000, 2, 21)
  var ariesEnd = new Date(0000, 3, 19) 
  console.log(ariesStr < d && d < ariesEnd)
}

<select id="month">
  <option value=""></option>
  <option value="January">January</option>
  <option value="February">February</option>
  <option value="March">March</option>
  <option value="April">April</option>
  <option value="May">May</option>
  <option value="June">June</option>
  <option value="July">July</option>
  <option value="August">August</option>
  <option value="September">September</option>
  <option value="October">October</option>
  <option value="November">November</option>
  <option value="December">December</option>
</select>
<select id="date">
  <option value=""></option>
  <option value="1st">1</option>
  <option value="2nd">2</option>
  <option value="3rd">3</option>
  <option value="4th">4</option>
  <option value="5th">5</option>
  <option value="6th">6</option>
  <option value="7th">7</option>
  <option value="8th">8</option>
  <option value="9th">9</option>
  <option value="10th">10</option>
  <option value="11th">12</option>
  <option value="12th">12</option>
  <option value="13th">13</option>
  <option value="14th">14</option>
  <option value="15th">15</option>
  <option value="16th">16</option>
  <option value="17th">17</option>
  <option value="18th">18</option>
  <option value="19th">19</option>
  <option value="20th">20</option>
  <option value="21st">21</option>
  <option value="22nd">22</option>
  <option value="23rd">23</option>
  <option value="24th">24</option>
  <option value="25th">25</option>
  <option value="26th">26</option>
  <option value="27th">27</option>
  <option value="28th">28</option>
  <option value="29th">29</option>
  <option value="30th">30</option>
  <option value="31st">31</option>
</select>
<input type="button" onclick="getSelectValues()" id="button" value="Go">

Answer 2

我不知道你是如何打算，以检查它们是符号，但它实际上可能更容易保持的月份和日期分开。然后，一个简单的方法来检查的迹象会是这样的：

const months = {
  mar : { 
    cutoff: 21,
    oneSign: picses,
    otherSign: aries 
  },
  jul : {
    cutoff: 23,
    oneSign: cancer,
    otherSign: leo 
  },
  oct : { 
    cutoff: 22,
    oneSign: scorpio,
    otherSign: sagittarius
  }
}  

function getSign(month, day){
  if(day < months[month][cutoff]){ return months[month][oneSign]; }
  else { return months[month][otherSign]; }
}