Udregn alder fra 3 select bokse

Gå ind på http://roenving.users.whitehat.dk/date/roenvingDate.html og hent roenvingDate.js fra zip-filen, og sæt følgende funktion ind:

<script type="text/javascript" src="roenvingDate.js"></script>
<script type="text/javascript">
function visDato(f){
  var dag = +f.foed_dag.value;
  var maan = +foed_maan.value - 1;
  var aar = +f.foed_aar.value;
  var refd = new Date(aar,maan,dag);
  var alder = refd.age(new Date(),true);
  document.getElementById('actAge').innerHTML = alder[0] + " år, " + " alder[1] + " måned" + (alder[1]==1?" ":"er ") + alder[2] + "dag" + (alder[2]==1?"":"e");
}
</script>

Sæt en onchange på alle dine selects (og husk, at der skal være en form rundt om !-)

-- sæt også en knap ind, så man også kan få alderen, hvis man tilfældigvis har den dato, som er default:

<form>

-- dine selects ...
<select name="foed_dag" onchange="visDato(this.form);">


...

<span id="actAge">&nbsp;</span><br>
<button onclick="visDato(this.form);">Vis alder</button>
</form>

-- og der var lige 2 fejl i scriptet:

<script type="text/javascript">
function visDato(f){
  var dag = +f.foed_dag.value;
  var maan = +f.foed_maan.value - 1;
  var aar = +f.foed_aar.value;
  var refd = new Date(aar,maan,dag);
  var alder = refd.age(new Date(),true);
  document.getElementById('actAge').innerHTML = alder[0] + " år, " + alder[1] + " måned" + (alder[1]==1?" ":"er ") + alder[2] + "dag" + (alder[2]==1?"":"e");
}
</script>

Det skal bare være noget simpelt, som bare skriver: alder = 15

Ja, men den skal vel også regne rigtigt, så den dagen før en fødselsdag angiver det rigtige antal år ?-)

-- en simpel ting vil typisk lave den slags fejl, f.eks. er den algoritme, som bruges på ebruger.dk skruet sådan sammen, at den regner forkert, når datoen i måneden falder efter den dato, man er født på, og det er faktisk en lidt irriterende udregning, medmindre man tager den fulde konsekvens og bruger den type udregning, som jeg gør i det script !-)

-- og vil du kun have antal år sletter du bare måned og dag fra ovenstående:

  document.getElementById('actAge').innerHTML = alder[0] + " år";

Nu har jeg prøvet med, men det virker ikke:

<from>

<select name="foed_dag" size="1">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</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="foed_maan" size="1">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>

<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select> / <select name="foed_aar" size="1">
<option value="1900">1900</option>
<option value="1901">1901</option>
<option value="1902">1902</option>
<option value="1903">1903</option>
<option value="1904">1904</option>
<option value="1905">1905</option>
<option value="1906">1906</option>
<option value="1907">1907</option>
<option value="1908">1908</option>
<option value="1909">1909</option>

<option value="1910">1910</option>
<option value="1911">1911</option>
<option value="1912">1912</option>
<option value="1913">1913</option>
<option value="1914">1914</option>
<option value="1915">1915</option>
<option value="1916">1916</option>
<option value="1917">1917</option>
<option value="1918">1918</option>
<option value="1919">1919</option>

<option value="1920">1920</option>
<option value="1921">1921</option>
<option value="1922">1922</option>
<option value="1923">1923</option>
<option value="1924">1924</option>
<option value="1925">1925</option>
<option value="1926">1926</option>
<option value="1927">1927</option>
<option value="1928">1928</option>
<option value="1929">1929</option>

<option value="1930">1930</option>
<option value="1931">1931</option>
<option value="1932">1932</option>
<option value="1933">1933</option>
<option value="1934">1934</option>
<option value="1935">1935</option>
<option value="1936">1936</option>
<option value="1937">1937</option>
<option value="1938">1938</option>
<option value="1939">1939</option>

<option value="1940">1940</option>
<option value="1941">1941</option>
<option value="1942">1942</option>
<option value="1943">1943</option>
<option value="1944">1944</option>
<option value="1945">1945</option>
<option value="1946">1946</option>
<option value="1947">1947</option>
<option value="1948">1948</option>
<option value="1949">1949</option>

<option value="1950">1950</option>
<option value="1951">1951</option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>

<option value="1950">1950</option>
<option value="1951">1951</option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>

<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>

<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>

<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>

<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>

<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
</select>

<script type="text/javascript" src="roenvingDate.js"></script>
<script type="text/javascript">
function visDato(f){
  var dag = +f.foed_dag.value;
  var maan = +f.foed_maan.value - 1;
  var aar = +f.foed_aar.value;
  var refd = new Date(aar,maan,dag);
  var alder = refd.age(new Date(),true);
  document.getElementById('actAge').innerHTML = alder[0] + " år";
}
</script>

<span id="actAge">&nbsp;</span><br>
<button onclick="visDato(this.form);">Vis alder</button>
</form>

Så lige at der stod <from> det skulle self være <form> og nu virker det.. men tjekker det lige

Men er det testet i alle browsere? og virker i dem?

-- lad mig sige det sådan, at jeg har skrevet det ret omhyggeligt og selv har testet scriptet i mine egne browsere, og det er også brugt i nogle professionelle løsninger, hvor jeg ved, at de som standard kræver understøttelse af IE5+ (minus Mac !-), Gecko-browserne, Safari og helst også Konqueror, og jeg har ingen tilbagemeldinger fået, om at det ikke virker ...

-- hvis browseren er så gammel, at den ikke understøtter javascripts prototype-ting, virker det selvfølgelig heller ikke, men der skal man ifølge min reference tilbage til Netscape 2 eller den første udgave af IE3 !o]

Kan det ikke laves så den automatisk viser det? Så den der kanp ikke skal være der?

Den knap er der kun, fordi det kan være at en bruger vælger at bruge d. 1/1-1900 som angivelse, for den beregner det jo netop hver gang, du laver en ændring i select-boksene !-)

Men hvordan kan jeg fjerne den?.. Man kan jo bare gør sådan at der står 105 år også når man ændre regner den igen.. altså at der står 105 år til at starte med..

Ja, det kan du jo selvfølgelig !-)

Hehe du svarede ikke .P Hvordan gør jeg sådan? at knappen ikke behøves?

F.eks.

window.onload = function(){
  visDato(document.forms[0]);
}

-- og så fjerner du knappen !-)

-- bemærk at forms[0] betyder den første form på dokumentet, måske har du andre, så tallet skal ændres !o]

Velbekomme '-)

Det ændre sig ikke når man så prøver at ændre på datoen så står der stadig 105

Du kunne også:

<span id="actAge">105 år</span><br>

-- men så skal du ændre den til nytår !-)

Fandt selv ud af det.. mange tak for hjælpen!

-- og tak for point ;~}