Zeige Details von 3 Dropdown-Menüs

Ich habe Seite auf einer Website Ich mache für das College und ich habe ein Problem mit der Registrierungsseite. Ich möchte ein neues Fenster mit den eingegebenen Details öffnen. Unten ist der Code, den ich erhielt, der die Daten zeigt, die in ein Dropdown-Menü eingegeben wurden, aber der Geburtstag hat 3 Menüs, eines für Tag, Monat, Jahr. Ich brauche Hilfe, um den Code von diesen 3 Dropdown-Menüs zu erhalten, anstatt nur einen. Danke für Ihre Hilfe!Zeige Details von 3 Dropdown-Menüs

function getdropdownvalue() 
    { 
     var range = document.form1.DOBDay.selectedIndex 
     return document.form1.DOBDay.options[range].value 
    } 



     <body> 
     <form action="" method="post" name="form1" onsubmit="checkdetails()"> 
     <table bgcolor="white" width="700" border="0" align="center"> 
     <col width="200"> 
     <col width="200"> 


     <tr> 
     <th colspan = "2" align = "center" bgcolor="grey"> Fill the form to sign up. </th> 
     </tr> 
    <tr> 
     <td>&nbsp;</td> 
     </tr> 


     <tr> 
     <td colspan="2" style="font-size:12px">Fields marked with * are mandatory</td> 
     </tr> 


     <tr> 
     <td>&nbsp;</td> 
     </tr> 


     <tr> 
      <td>Name*</td> 
      <td>Surname*</td> 
     </tr> 


     <tr> 
      <td><label> 
      <input type="text" name="txtname" id="txtname" class="info" /> 
      <td><label> 
      <input type="text" name="txtsurname" id="txtsurname" class="info" /> 
      </label></td> 
     </tr> 

     <tr> 
     <td> Create Username*</td> 
     <td> Birthday</td> 
     </tr> 

     <tr> 
     <td><label> 
     <input type="text" name="txtusername" id="txtusername" class="info"/> 
     </label></td> 




     <td><select name="DOBMonth"> 
     <option> Month </option> 
     <option value="January">January</option> 
     <option value="Febuary">Febuary</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 name="DOBDay"> 
     <option> Day </option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     <option value="5">5</option> 
     <option value="6">6</option> 
     <option value="7">7</option> 
     <option value="8">8</option> 
     <option value="9">9</option> 
     <option value="10">10</option> 
     <option value="11">11</option> 
     <option value="12">12</option> 
     <option value="13">13</option> 
     <option value="14">14</option> 
     <option value="15">15</option> 
     <option value="16">16</option> 
     <option value="17">17</option> 
     <option value="18">18</option> 
     <option value="19">19</option> 
     <option value="20">20</option> 
     <option value="21">21</option> 
     <option value="22">22</option> 
     <option value="23">23</option> 
     <option value="24">24</option> 
     <option value="25">25</option> 
     <option value="26">26</option> 
     <option value="27">27</option> 
     <option value="28">28</option> 
     <option value="29">29</option> 
     <option value="30">30</option> 
     <option value="31">31</option> 
    </select> 

    <select name="DOBYear"> 
     <option> Year </option> 
     <option value="2016">2016</option> 
     <option value="2015">2015</option> 
     <option value="2014">2014</option> 
     <option value="2013">2013</option> 
     <option value="2012">2012</option> 
     <option value="2011">2011</option> 
     <option value="2010">2010</option> 
     <option value="2009">2009</option> 
     <option value="2008">2008</option> 
     <option value="2007">2007</option> 
     <option value="2006">2006</option> 
     <option value="2005">2005</option> 
     <option value="2004">2004</option> 
     <option value="2003">2003</option> 
     <option value="2002">2002</option> 
     <option value="2001">2001</option> 
     <option value="2000">2000</option> 
     <option value="1999">1998</option> 
     <option value="1998">1998</option> 
     <option value="1997">1997</option> 
     <option value="1996">1996</option> 
     <option value="1995">1995</option> 
     <option value="1994">1994</option> 
     <option value="1993">1993</option> 
     <option value="1992">1992</option> 
     <option value="1991">1991</option> 
     <option value="1990">1990</option> 
     <option value="1989">1989</option> 
     <option value="1988">1988</option> 
     <option value="1987">1987</option> 
     <option value="1986">1986</option> 
     <option value="1985">1985</option> 
     <option value="1984">1984</option> 
     <option value="1983">1983</option> 
     <option value="1982">1982</option> 
     <option value="1981">1981</option> 
     <option value="1980">1980</option> 
     <option value="1979">1979</option> 
     <option value="1978">1978</option> 
     <option value="1977">1977</option> 
     <option value="1976">1976</option> 
     <option value="1975">1975</option> 
     <option value="1974">1974</option> 
     <option value="1973">1973</option> 
     <option value="1972">1972</option> 
     <option value="1971">1971</option> 
     <option value="1970">1970</option> 
     <option value="1969">1969</option> 
     <option value="1968">1968</option> 
     <option value="1967">1967</option> 
     <option value="1966">1966</option> 
     <option value="1965">1965</option> 
     <option value="1964">1964</option> 
     <option value="1963">1963</option> 
     <option value="1962">1962</option> 
     <option value="1961">1961</option> 
     <option value="1960">1960</option> 
     <option value="1959">1959</option> 
     <option value="1958">1958</option> 
     <option value="1957">1957</option> 
     <option value="1956">1956</option> 
     <option value="1955">1955</option> 
     <option value="1954">1954</option> 
     <option value="1953">1953</option> 
     <option value="1952">1952</option> 
     <option value="1951">1951</option> 
     <option value="1950">1950</option> 
     <option value="1949">1949</option> 
     <option value="1948">1948</option> 
     <option value="1947">1947</option> 
    </select> 




     <tr> 
      <td>Email*</td> 
      <td>Confirm Email*</td> 
     </tr> 


     <tr> 
      <td><label> 
      <input type="text" name="txtemail" id="txtemail" class="info" onchange="ValidateEmail(txtemail)" /> 
      <td><label> 
      <input type="text" name="txtemail2" id="txtemail2" class="info" onchange="ValidateEmail2(txtemail2)"/> 
      </label></td> 
     </tr> 


     <tr> 
      <td>Password*</td> 
      <td>Confirm Pasword*</td> 
     </tr> 


     <tr> 
      <td><label> 
      <input type="password" name="txtpassword" id="txtpassword" class="info"/> 
      <td><label> 
      <input type="password" name="txtpassword2" id="txtpassword2" class="info"/> 
      </label></td> 
     </tr> 


     <td colspan="2" style="font-size:12px">**Passwords must be at least 8 characters in lenght.</td> 
     </tr> 

     <tr> 
     <td>&nbsp;</td> 
     </tr> 


      <tr> 
      <td colspan="2"> 
      <label> 
       <input type="radio" name="terms" value="terms" id="terms" /> 
       I agree to the Terms and Conditions</label> 
      </td></tr> 
      <br><br><br> 
      <tr> 
      <td colspan="2"><label> 
       <input type="radio" name="notify" value="notify" id="notify" /> 
       I want to receive notifications by text/email about new products in stock.</label> 
       </td> 
     </tr> 


     <tr> 
     <td>&nbsp;</td> 
     </tr> 

     <tr> 
     <td><label> 
      <input type="submit" name="Login" id="Login" value="Login" onclick="checkdetails()" /> 
     </label></td> 
     <td><label> 
      <input type="reset" name="Reset" id="Reset" value="Reset" /> 
     </label></td> 
     </tr> 

     <tr> 
     <td>&nbsp;</td> 
     </tr> 
     </table> 
    </form>

Quelle

2016-04-21 Shauna Goodman Fitzpatrick

Ihre Frage ist unklar, Do you nur wan t um die Dropdown-Listenwerte mit js zu erhalten? –

Ja, tut mir leid. Wenn ich 04 02 1994 in diese drei Dropdown-Menüs eingegeben habe, möchte ich, dass es ein Fenster öffnet, das sagt, dass Sie 04 02 1994 eingegeben haben. –

Überprüfen Sie die Antwort, ich denke, was Sie wollten. –

erhalten Sie einfach den Wert aller Elemente, die Sie eins nach dem anderen müssen (da Sie sagen, Sie wollen Monat und Tag in numerischer Format bekomme ich den Index dieser Elemente nicht den Wert)

function getdropdownvalue() 
{ 
     var month = document.form1.DOBMonth.selectedIndex; 
     var day = document.form1.DOBDay.selectedIndex; 
     var year = document.form1.DOBYear.options[document.form1.DOBDay.selectedIndex].value; 
     alert(month+' '+day+' '+year); 
     return month+' '+day+' '+year; 
}

Quelle

2016-04-21 15:21:16

Dank einer Million das getan, was ich brauchte! –

Bevor ich Ihnen die Lösung für das geben, bemerkte ich in Ihrem Code, den Sie ein paar Endtags fehlen, die Dropdown-Listen in Ihrem Code Ausfüllen, für die Formatierung Verwendung von Tabelle usw. Dies sind einige Vorschläge:

Füllen Sie die Dropdown-Menüs mit JS.
Verwenden Sie einen guten Editor, mit dem Sie verpasste Tags identifizieren können.
Fügen Sie id zu Ihren select/input Anweisungen hinzu, um das Arbeiten mit JS zu erleichtern.
Sie ein Framework wie Bootstrap, so dass es leicht zu formatieren Sie Ihre Seite und auch die Verwendung von <table> zum Formatieren der Seite zu vermeiden.

das für Sie ein einfaches Snippet ist:

function a() { 
 
    var m = document.getElementById("DOBMonth"); 
 
    var y = document.getElementById("DOBYear"); 
 
    var d = document.getElementById("DOBDay"); 
 
    alert(" D:"+d.options[d.selectedIndex].value+" M:"+m.options[m.selectedIndex].value+" Y:"+y.options[m.selectedIndex].value); 
 
}

<select name="DOBMonth" id="DOBMonth"> 
 
    <option> Month </option> 
 
    <option value="January">January</option> 
 
    <option value="Febuary">Febuary</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 name="DOBDay" id="DOBDay"> 
 
    <option> Day </option> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    <option value="6">6</option> 
 
    <option value="7">7</option> 
 
    <option value="8">8</option> 
 
    <option value="9">9</option> 
 
    <option value="10">10</option> 
 
    <option value="11">11</option> 
 
    <option value="12">12</option> 
 
    <option value="13">13</option> 
 
    <option value="14">14</option> 
 
    <option value="15">15</option> 
 
    <option value="16">16</option> 
 
    <option value="17">17</option> 
 
    <option value="18">18</option> 
 
    <option value="19">19</option> 
 
    <option value="20">20</option> 
 
    <option value="21">21</option> 
 
    <option value="22">22</option> 
 
    <option value="23">23</option> 
 
    <option value="24">24</option> 
 
    <option value="25">25</option> 
 
    <option value="26">26</option> 
 
    <option value="27">27</option> 
 
    <option value="28">28</option> 
 
    <option value="29">29</option> 
 
    <option value="30">30</option> 
 
    <option value="31">31</option> 
 
</select> 
 

 
<select name="DOBYear" id="DOBYear"> 
 
    <option> Year </option> 
 
    <option value="2016">2016</option> 
 
    <option value="2015">2015</option> 
 
    <option value="2014">2014</option> 
 
    <option value="2013">2013</option> 
 
    <option value="2012">2012</option> 
 
    <option value="2011">2011</option> 
 
    <option value="2010">2010</option> 
 
    <option value="2009">2009</option> 
 
    <option value="2008">2008</option> 
 
    <option value="2007">2007</option> 
 
    <option value="2006">2006</option> 
 
    <option value="2005">2005</option> 
 
    <option value="2004">2004</option> 
 
    <option value="2003">2003</option> 
 
    <option value="2002">2002</option> 
 
    <option value="2001">2001</option> 
 
    <option value="2000">2000</option> 
 
    <option value="1999">1998</option> 
 
    <option value="1998">1998</option> 
 
    <option value="1997">1997</option> 
 
    <option value="1996">1996</option> 
 
    <option value="1995">1995</option> 
 
    <option value="1994">1994</option> 
 
    <option value="1993">1993</option> 
 
    <option value="1992">1992</option> 
 
    <option value="1991">1991</option> 
 
    <option value="1990">1990</option> 
 
    <option value="1989">1989</option> 
 
    <option value="1988">1988</option> 
 
    <option value="1987">1987</option> 
 
    <option value="1986">1986</option> 
 
    <option value="1985">1985</option> 
 
    <option value="1984">1984</option> 
 
    <option value="1983">1983</option> 
 
    <option value="1982">1982</option> 
 
    <option value="1981">1981</option> 
 
    <option value="1980">1980</option> 
 
    <option value="1979">1979</option> 
 
    <option value="1978">1978</option> 
 
    <option value="1977">1977</option> 
 
    <option value="1976">1976</option> 
 
    <option value="1975">1975</option> 
 
    <option value="1974">1974</option> 
 
    <option value="1973">1973</option> 
 
    <option value="1972">1972</option> 
 
    <option value="1971">1971</option> 
 
    <option value="1970">1970</option> 
 
    <option value="1969">1969</option> 
 
    <option value="1968">1968</option> 
 
    <option value="1967">1967</option> 
 
    <option value="1966">1966</option> 
 
    <option value="1965">1965</option> 
 
    <option value="1964">1964</option> 
 
    <option value="1963">1963</option> 
 
    <option value="1962">1962</option> 
 
    <option value="1961">1961</option> 
 
    <option value="1960">1960</option> 
 
    <option value="1959">1959</option> 
 
    <option value="1958">1958</option> 
 
    <option value="1957">1957</option> 
 
    <option value="1956">1956</option> 
 
    <option value="1955">1955</option> 
 
    <option value="1954">1954</option> 
 
    <option value="1953">1953</option> 
 
    <option value="1952">1952</option> 
 
    <option value="1951">1951</option> 
 
    <option value="1950">1950</option> 
 
    <option value="1949">1949</option> 
 
    <option value="1948">1948</option> 
 
    <option value="1947">1947</option> 
 
</select> 
 

 
<button onclick="a()">Click</button>

Quelle

2016-04-21 15:16:43

das scheint richtig, aber immer noch nicht in meinem Code arbeiten. –

fügen Sie IDs zu dem '