Hvem har tid til at kigge på noget teori?
Halløj, jeg er en rimelig meget newbie som lige har begivet mig ud i JavaScript. Jeg har lavet et Script der kan beregne varmetabet på et hus. Til dette script skal skrives noget teori. Jeg har skrevet noget - men er ikke helt tilfreds med det. Hvis du har tid til at kigge på det og rette samt måske tilføje og evt. råd til scriptet vil jeg blive lykkelig. Fuld point til personen som vil hjælpe mig.Scriptet ser således ud:
<html>
<head>
<body>
<script type="text/javascript" language="JavaScript">
//her er funktionen der beregner varmetabet
function varmetab(){
//her er de forskellige variabler som bliver hentet i funktionen
var a = parseFloat(document.getElementById('A').value)
var b = parseFloat(document.getElementById('B').value)
var c = parseFloat(document.getElementById('C').value)
var d = parseFloat(document.getElementById('D').value)
var e = parseFloat(document.getElementById('E').value)
var f = parseFloat(document.getElementById('F').value)
var g = parseFloat(document.getElementById('G').value)
//varmetabsrammen beregninger findes, se i rapporten hvordan
//væg
vrvaeg = 0.3 * (a - e) * 32
//gulv
vrgulv = 0.15 * (b + c) * 12
//loft
vrloft = 0.15 * d * 37
//vindue + dør
vrva = (b + c) * 0.22
vrvindor = 1.8 * vrva * 32
//varmetabsrammen
vr = vrvaeg + vrgulv + vrloft + vrvindor
//det foreløbige varmetab findes, se i rapporten hvordan
//væg
fvvag = 0.268 * a * 32
//trægulv
fvtra = 0.133 * b * 12
//klinker
fvkli = 0.136 * c * 12
//loft
fvlof = 0.129 * d * 37
//vindue + dør
fvvindor = 1.1 * e * 32
//fugetab
fvfug = 0.05 * f * 32
//linietab
fvlin = 0.24 * g * 32
//det foreløbige varmetab
fv = fvvag + fvtra + fvkli + fvlof + fvvindor
// det aktuelle varmetab
av = fv + fvfug + fvlin
document.getElementById("out1").value = "Varmetabsramme: " + vr + " W";
document.getElementById("out2").value = "Det forløbigt varmetab: " + fv + " W";
document.getElementById("out3").value = "Det aktuelle varmetab: " + av + " W";
}
function validate() {
// Kontrol af vægarealet
if (valider.A.value == "") {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.A.focus();
return false;
}
// Kontrol af trægulvarealet
if (valider.B.value == "") {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.B.focus();
return false;
}
// kontrol af klinkearealet
if (valider.C.value == 0) {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.C.focus();
return false;
}
// Kontrol af loftarealet
if (valider.D.value == "") {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.D.focus();
return false;
}
// Kontrol af vindue + dør
if (valider.E.value == "") {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.E.focus();
return false;
}
// kontrol af fuge
if (valider.F.value == "") {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.F.focus();
return false;
}
// Kontrol af linie
if (valider.G.value == "") {
alert("Der skal indtastes et areal, se evt. hjælpeboxen");
valider.G.focus();
return false;
}
return true;
}
function popup(tekst) {
var popup = open("", "_blank", "width=150, height=100, valign=center, align=center");
popup.document.write(tekst);
}
function printpage() {
window.print();
}
</script>
<form name="valider" Onsubmit="return validate()";>
<p>Indtast vægareal</p>
<input tabindex="1" type="text" id="A" >
<a href="#" onClick="popup('Se billedet til højre for at finde det ønskede vægareal');" >Hjælp</a>
<p>Indtast gulvareal, trægulv</p>
<input tabindex="2" type="text" Id="B" >
<a href="#" onClick="popup();" >Hjælp</a>
<p>Indtast gulvareal, klinker</p>
<input tabindex="3" type="text" Id="C" >
<a href="#" onClick="popup();" >Hjælp</a>
<p>Indtast loftareal</p>
<input tabindex="4" type="text" Id="D" >
<a href="#" onClick="popup();" >Hjælp</a>
<p>Indtast vindueareal samt dørareal</p>
<input tabindex="5" type="text" Id="E" >
<a href="#" onClick="popup();" >Hjælp</a>
<p>Indtast fugemeter</p>
<input tabindex="6" type="text" Id="F" >
<a href="#" onClick="popup();" >Hjælp</a>
<p>Indtast liniemeter</p>
<input tabindex="7" type="text" Id="G" >
<a href="#" onClick="popup();" >Hjælp</a>
<p>
<input tabindex="8" type="button" value="Beregn varmetab" onclick = "if (validate()) varmetab()";>
<input tabindex="9" type="button" value="Printvarmetabet" onclick = printpage();>
<input type="reset" value="Reset">
<p></p>
<input type="text" id="out1" size="50" value="Varmetabsramme"><br>
<input type="text" id="out2" size="50" value="Det forløbigt varmetab"><br>
<input type="text" id="out3" size="50" value="Det aktuelle varmetab"><br>
<span id="output"></span>
</form>
</body>
</head>
</html>
Og teorien jeg har været igang med ser således ud :( :
function varmetab()
Denne funktion som hedder varmetab er grundstenen i scriptet. Det er denne funktion der laver alle beregningerne til at finde varmetabet.
var
En variabel er en værdi med et navn som evt. skal hentes flere gange i programmet.
I programmet er var blevet brugt i sammenhæng med input boksene. Værdierne som brugeren indtaster i inputboksene bliver hente op til variablerne. Derved kan brugerens værdier hentes vha. varibaler og et simpelt navn for hver variabel.
parseFloat
Parsefloat formaterer det indtastede til tal fra tekst.
function validate()
Funktionen validate går ind og checker om der er skrevet med tal i indtastningsfeltet. Hvis brugeren har tastet f.eks. et bogstav ind fremkommer der en alert med fejlen og brugeren bliver bedt om at indtaste et tal. Dette stopper først når brugeren har tastet korrekt. Den laver altså en return false.
I programmet er der blevet brugt isNan som går ind og tjekker om der bliver skrevet med tal eller bogstaver. Der er også brugt ”” som går ind og tjekker om felterne er fyldt ud.
Hvis disse ting er i orden laver den en return true.
alert
Med alert sender man en meddelelse til brugeren. Denne alert-boks bliver kaldt i validate når brugeren taster noget ”ikke-gyldigt” ind.
tabindex
Hvis man som erfaren bruger afprøver dette program vil det være trælst at skulle bruge tab 2 gange for at komme videre til næste indtastningsboks.
onClick
onClick er en funktion der bliver kaldt, når brugeren klikker med musen på hjælp symbolet.
I programmet er onClick benyttet til at hente hjælp, hvis man sidder i problemer i beregningerne. Når brugeren klikker med musen over hjælp symbolet åbnes der et nyt vindue med hjælp til brugeren.
Funktionen der bliver kaldt er popup().
Document
Med document udskriver man en tekst i det aktuelle dokument. Dette bliver gjort to steder, et med document.write og et med document.getElementById. Med document.write går den ind og udskriver en tekst i det aktuelle dokument, mens document.getElementById går ind og henter en ID som er defineret i input-boksene og derefter skriver den til variablen.