Udfør function hvis validering = true

Hej

Jeg har et problem med Javascript (som absolut ikke er min stærke side). Jeg har lavet et div med en loadscreen som aktiveres, når man klikker på et element på siden, og det virker fint. Problemet er at jeg har en form på siden, som jeg validerer med javascript. Problemet er at loadscreen'en kommer så snart man klikker på formknappen. Den skal kun komme hvis valideringen går igennem. På de andre elementer på siden, skal den komme med det samme. Jeg håber der er en der kan hjælpe :-)

java script:

        var active = 0;


        function ChangeLayer(now){
        eval("document.getElementById('content" + active + "').style.visibility='hidden';");
        eval("document.getElementById('content" + now + "').style.visibility='visible';");
//    -            var next = document.all ("content" + now) . style;
//    -    current.visibility = "hidden";
//    -    next.visibility = "visible";
        active = now;

    }

//----------------------------------
    function tjeck()
   

                    {
    form = document.additem;
      if ( form.vare.value.length < 1 ) {
      alert ("Du skal angive en vare.");
        return false;
      form.vare.focus();
    }
                        {
    form = document.additem;
      if ( form.vare.value.length > 15 ) {
      alert ("Varens navn er for langt. Max. 15 tegn.");
        return false;
      form.vare.focus();
    }
   
                {
    form = document.additem;
      if ( form.beskr.value.length > 255 ) {
      alert ("Beskrivelsen er for lang. Max 255 tegn.");
        return false;
       
      form.beskr.focus();
    }


}
}

    return true;

    }
   
//----------------------------------


Html:


<div id="content0" style="position:absolute;top:0px;left:0px;z-index:0;visibility:visible;">
</div>

<div id="content1" style="position:absolute;top:0px;left:0px;z-index:0;visibility:hidden;">
</div>


<div id="content2" style="position:absolute;top:0px;left:0px;visibility:hidden;">
<table width="100%" align="center"><tr><td height="100%" align="center" valign="middle">
<br /><br /><br /><br /><img src="images/loadingicon.gif" border="0" />
</td></tr></table></div>


<div id="top" align="center" onclick="ChangeLayer(2);">
<img src="images/spacer.png" width="151" height="33" /><a href="shoppinglist.php"><img src="images/fane2.png" border="0" /></a>
</div>

      <form name="additem" method="post" action="additem2.php" onSubmit="return tjeck() && html2entities(this.vare, this.maal, this.beskr);">


<input placeholder="Varens navn" name="vare" type="text" onblur="initialCap(this);" />

<input type="image" src="images/knap_tilfoejvarer.png" onclick="ChangeLayer(2);" />