If else statement virker ikke

der flere problemmer med din kode.
1: når man kalder funktioner i javascript skal man have paranteser med, selvom der ikke er nogle parameterer. det vil sige .show() og .hide()

2: Du mangler semikolon for hver linje, dvs.

Scriptet:
if (document.getElementById('clicked').value < 50) {
    document.getElementById('ovnforkert').show();
    document.getElementById('ovnrigtig').hide();
}else{
    document.getElementById('ovnrigtig').show();
    document.getElementById('ovnforkert').hide();
}

3: Der er ikke nogle funktioner der hedder show() og hide() i javascript for DOM elementer. Der er tilgængeld funktioner der hedder show() hide() hvis du bruger bibliotekket jquery. I det tilfælde skal du så skrive $("#ovnforkert").show() eller $("#ovnforkert").hide()

Tak for det, hvis du kan skrive et svar får du pointene :)

Det var så lidt ;)

fik du løst dit problem egentlig?

Nej, desværre

beskriv problemet, så kan det være vi kan løse det ;)

ellers har jeg ikke rigtig fortjent pointene

Når clicked har en værdi af mere end 50 skal den vise ovnforkert som ser her sådan ud:

<div id="ovnforkert" style="cursor:pointer; opacity:0.5; position:absolute; left:19%; top:10px;">
<a>
<img src="http://www.idenyt.dk/Global/Denmark/Boligen/1110/nthh_ovn.jpg"
style="width:150px;
height:65px;
position:absolute;
top:440px;" />
<center>
<h3 style="font-family:monospace; position:absolute; top:489px; width:200px; left:-25px; color:red;">OVN 50 Keks</h3>
</center>
</a>
</div>


Eller skal den vise ovn rigtig som ser sådan her ud:

<div id="ovnrigtig" style="cursor:pointer; opacity:1; position:absolute; left:19%; top:10px;">
    <input style="cursor:default; position:absolute; top:415px; left:50px;" id="clickedovn" size="5" onfocus="this.blur();" value="0">
<a id="ovne" onclick="ovnKlik();">
<img src="http://www.idenyt.dk/Global/Denmark/Boligen/1110/nthh_ovn.jpg"
style="width:150px;
height:65px;
position:absolute;
top:440px;" />
    <div id="ovntekst">
<center>
<h3 id="ovntekst" style="font-family:monospace; position:absolute; top:489px; width:200px; left:-25px;">OVN 50 Keks</h3>
</center>
    </div>

bruger du jQuery?

Nej

Men det kan jeg da komme til.

hvis du skal lave meget javascript med mange DOM manipulationer vil jeg nok råde dig til det. Hvis det overstående problem er det eneste du skal løse, så synes jeg du skal holde dig til ren javascript (det også god øvelse (har arbejdede sammen med folk som kun kunne bruge jQuery -- ikke godt!). Men jeg brygger lige noget sammen til dig når jeg kommer hjem fra uni ;)

det godt nok ikke synderligt kønt men det virker efter hensigten tror jeg nok.

<script>
  function ovnKlik(){
    document.getElementById("clickedovn").value++;
    if(document.getElementById("clickedovn").value > 50){
        document.getElementById("ovnforkert").removeAttribute("class", "hide");
        document.getElementById("ovnrigtig").setAttribute("class", "hide");
    }else{
        document.getElementById("ovnrigtig").removeAttribute("class", "hide");
        document.getElementById("ovnforkert").setAttribute("class", "hide");
    }
  }
</script>

<style>
  div.hide {
    display: none;
  }
</style>

<div id="ovnforkert" class="hide" style="cursor:pointer; opacity:0.5; position:absolute; left:19%; top:10px;">
  <a>
    <img src="http://www.idenyt.dk/Global/Denmark/Boligen/1110/nthh_ovn.jpg"
        style="width:150px;
                height:65px;
                position:absolute;
                top:440px;" />
    <center>
      <h3 style="font-family:monospace; position:absolute; top:489px; width:200px; left:-25px; color:red;">OVN 50 Keks</h3>
    </center>
  </a>
</div>


Eller skal den vise ovn rigtig som ser sådan her ud:

<div id="ovnrigtig" style="cursor:pointer; opacity:1; position:absolute; left:19%; top:10px;">
  <input style="cursor:default; position:absolute; top:415px; left:50px;" id="clickedovn" size="5" onfocus="this.blur();" value="0">
  <a id="ovne" onclick="ovnKlik();">
    <img src="http://www.idenyt.dk/Global/Denmark/Boligen/1110/nthh_ovn.jpg"
        style="width:150px;
                height:65px;
                position:absolute;
                top:440px;" />
    <div id="ovntekst">
      <center>
        <h3 id="ovntekst" style="font-family:monospace; position:absolute; top:489px; width:200px; left:-25px;">OVN 50 Keks</h3>
      </center>
    </div>
    </a>
</div>

tak