Objekter og tabulering
Hej EksperterJeg har leget lidt med oprettelse af egne objekter i javascript.
Jeg har lavet nedenstående eksempel, og vil gerne vide hvordan jeg får focus til at hoppe frem til næste tekst boks, når jeg har indtastet en værdi.
f.eks: Når jeg har indtastet antal 3'er skal focus flyttes til antal 2'er.
<HTML>
<HEAD>
<TITLE>Objekt test</TITLE>
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//class constructor
function Serv(ID, vn) {
//class properties
this.Antal3 = 0;
this.Antal2 = 0;
this.Antal1 = 0;
this.Antal0 = 0;
this.AntalFejl = 0;
this.ID = ID;
this.VarNavn = vn;
//class methods
this.Antal3er = Antal3er;
this.Antal2er = Antal2er;
this.Antal1er = Antal1er;
this.Antal0er = Antal0er;
this.AntalFejler = AntalFejler;
this.Point = Point;
this.Antal_udenSF = Antal_udenSF;
this.Antal_medSF = Antal_medSF;
this.eff = eff;
this.NulProcent = NulProcent;
this.FejlProcent = FejlProcent;
this.draw = draw;
//this.draw();
} // end class constructor
//methods for class Serv
function Antal3er(ant) {
this.Antal3 = parseInt(ant);
this.draw();
}
function Antal2er(ant) {
this.Antal2 = parseInt(ant);
this.draw();
}
function Antal1er(ant) {
this.Antal1 = parseInt(ant);
this.draw();
}
function Antal0er(ant) {
this.Antal0 = parseInt(ant);
this.draw();
}
function AntalFejler(ant) {
this.AntalFejl = parseInt(ant);
this.draw();
}
function Point() {
var P;
P = (this.Antal3 * 3) + (this.Antal2 * 2) + (this.Antal1 * 1) + (this.Antal0 * 0);
return P;
}
function Antal_udenSF() {
var Antal;
Antal = this.Antal3 + this.Antal2 + this.Antal1 + this.Antal0;
return Antal;
}
function Antal_medSF() {
var Antal;
Antal = this.Antal3 + this.Antal2 + this.Antal1 + this.Antal0 + this.AntalFejl;
return Antal;
}
function eff() {
var Antal;
var Point;
Point = (this.Antal3 * 3) + (this.Antal2 * 2) + (this.Antal1 * 1) + (this.Antal0 * 0);
Antal = this.Antal3 + this.Antal2 + this.Antal1 + this.Antal0;
return Point/Antal;
}
function NulProcent() {
var antal;
antal = this.Antal_medSF();
return this.Antal0 / antal;
}
function FejlProcent() {
var antal;
antal = this.Antal_medSF();
return this.AntalFejl / antal;
}
function draw() {
this.ID.innerHTML = '';
this.ID.innerHTML += '<FORM METHOD=POST ACTION="" NAME="MyForm">';
this.ID.innerHTML += '3\'er: <INPUT SIZE="5" TYPE="text" LANGUAGE="JavaScript" VALUE="' + this.Antal3 + '" ONCHANGE="' + this.VarNavn + '.Antal3er(value)" NAME="' + this.ID + 'Serv3"><BR>';
this.ID.innerHTML += '2\'er: <INPUT SIZE="5" TYPE="text" LANGUAGE="JavaScript" VALUE="' + this.Antal2 + '" ONCHANGE="' + this.VarNavn + '.Antal2er(value)" NAME="' + this.ID + 'Serv2"><BR>';
this.ID.innerHTML += '1\'er: <INPUT SIZE="5" TYPE="text" LANGUAGE="JavaScript" VALUE="' + this.Antal1 + '" ONCHANGE="' + this.VarNavn + '.Antal1er(value)" NAME="' + this.ID + 'Serv1"><BR>';
this.ID.innerHTML += '0\'er: <INPUT SIZE="5" TYPE="text" LANGUAGE="JavaScript" VALUE="' + this.Antal0 + '" ONCHANGE="' + this.VarNavn + '.Antal0er(value)" NAME="' + this.ID + 'Serv0"><BR>';
this.ID.innerHTML += 'Fejl: <INPUT SIZE="5" TYPE="text" LANGUAGE="JavaScript" VALUE="' + this.AntalFejl + '" ONCHANGE="' + this.VarNavn + '.AntalFejler(value)" NAME="' + this.ID + 'ServFejl"><BR>';
this.ID.innerHTML += '<BR>';
this.ID.innerHTML += '</FORM>';
this.ID.innerHTML += '<BR>';
this.ID.innerHTML += '3er: ' + this.Antal3 + '<BR>';
this.ID.innerHTML += '2er: ' + this.Antal2 + '<BR>';
this.ID.innerHTML += '1er: ' + this.Antal1 + '<BR>';
this.ID.innerHTML += '0er: ' + this.Antal0 + '<BR>';
this.ID.innerHTML += 'Fejl: ' + this.AntalFejl + '<BR>';
this.ID.innerHTML += '<BR>';
this.ID.innerHTML += 'Point: ' + this.Point() + '<BR>';
this.ID.innerHTML += 'Antal: ' + this.Antal_udenSF() + ' (eksl fejl)<BR>';
this.ID.innerHTML += 'Antal: ' + this.Antal_medSF() + ' (incl fejl)<BR>';
this.ID.innerHTML += '<BR>';
this.ID.innerHTML += 'Effek: ' + this.eff() + '<BR>';
this.ID.innerHTML += '0\'er % ' + this.NulProcent() + '<BR>';
this.ID.innerHTML += 'Fejl % ' + this.FejlProcent() + '<BR>';
}
//-->
</SCRIPT>
<BODY>
<span id="MyTest">test</span>
<SCRIPT LANGUAGE="JavaScript">
ServTest = new Serv(MyTest, 'ServTest');
ServTest.draw();
</SCRIPT>
<BR><BR><BR><BR>
<span id="NyTest">hej</span>
<SCRIPT LANGUAGE="JavaScript">
MyServ = new Serv(NyTest, 'MyServ');
MyServ.Antal3er(10);
MyServ.Antal2er(10);
MyServ.draw();
</SCRIPT>
</BODY>
</HTML>
