javascript - 如何比较下拉菜单/选择菜单中的两个不同值并将其作为一个值应用于条件语句？

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">