Søg
Avatar billede badazz Novice
04. januar 2012 - 22:23 Der er 7 kommentarer og
1 løsning

Tæl op / ned med knap

Hej

Jeg har fået lavet denne her:
(jeg har selv udvidet den fra kun at kunne tælle op, til at kunne begge dele, men efter jeg har gjort det, står der ikke længere "0" som std. i feltet, og så tror jeg måske også på at koden kan forenkles lidt ?)

<script type ="text/javascript">
var x = 0;
function counta()
{
x += 1;
document.getElementById( "counting" ).value = x;
}
function countb()
{
x -= 1;
document.getElementById( "counting" ).value = x;
}
</script>
</head>
<body>
<input type ="button" value = "Op" onclick = "counta()"/>
<input id = "counting" type = "text" />
<input type ="button" value = "Ned" onclick = "countb()"/>

</body>


Hvad gør jeg, når jeg gerne vil have flere tællere på samme side ? kan det gøres enkelt ? (ligesom når man har varer i en indkøbskurv, og kan tælle op og ned ved være vare med + og - )

//Brian
Avatar billede olebole Juniormester
04. januar 2012 - 22:55 #1
<ole>

Du kunne lave en object constructor, som du kan kalde og oprette individuelle instanser af et objekt:


function Counter() {
    this._count = 0;
}
Counter.prototype.up = function() {
    this._count += 1;
};
Counter.prototype.down = function() {
    this._count -= 1;
};
Counter.prototype.get = function() {
    return this._count;
};

// Opret to forskellige instanser af Counter
var count_A = new Counter();
var count_B = new Counter();

count_A.up();
count_A.up();
count_A.up();
count_A.down();

count_B.down();
count_B.down();

alert(count_A.get());
alert(count_B.get());



/mvh
</bole>
Avatar billede olebole Juniormester
04. januar 2012 - 23:01 #2
Du kan også angive prototypen på denne måde:


function Counter() {
    this._count = 0;
}
Counter.prototype = {
    up: function() {
        this._count += 1;
    },
    down: function() {
        this._count -= 1;
    },
    get = function() {
        return this._count;
    }
};


Der er ikke forskel på virkemåden, så det er et spørgsmål om kodestil, og hvad der subjektivt giver bedst overblik
Avatar billede olebole Juniormester
04. januar 2012 - 23:02 #3
Oooops ...!


function Counter() {
    this._count = 0;
}
Counter.prototype = {
    up: function() {
        this._count += 1;
    },
    down: function() {
        this._count -= 1;
    },
    get: function() {
        return this._count;
    }
};


Avatar billede badazz Novice
04. januar 2012 - 23:11 #4
Kunne jeg lokke dig til at sætte det ind i denne her ?


<!--tæller 1-->
<input type ="button" value = "Op" onclick = "count_A.up()"/>
<input id = "" type = "text" />
<input type ="button" value = "Ned" onclick = "count_A.down()"/>
<!--tæller 1-->

<!--tæller 2-->
<input type ="button" value = "Op" onclick = "count_A.up()"/>
<input id = "" type = "text" />
<input type ="button" value = "Ned" onclick = "count_A.down()"/>
<!--tæller 2-->

for jeg får ikke andet en fejl :(
Avatar billede olebole Juniormester
04. januar 2012 - 23:49 #5
Som jeg lige skrev til en anden bruger: Nu er det på tide, jeg kommer i seng!  *D

Jeg har lavet constructoren om, så den faktisk virker:


<script type="text/javascript">
function Counter(sId) {
    this._count = 0;
    this._elmDisplay = document.getElementById(sId);
}
Counter.prototype.up = function() {
    this._elmDisplay.value = (++this._count);
};
Counter.prototype.down = function() {
    this._elmDisplay.value = (--this._count);
}
</script>

<!--tæller 1-->
<input type="button" value="Op" onclick="count_A.up()"/>
<input id="counting_A" type="text" />
<input type="button" value="Ned" onclick="count_A.down()"/>
<!--tæller 1-->

<!--tæller 2-->
<input type="button" value = "Op" onclick="count_B.up()"/>
<input id="counting_B" type="text" />
<input type="button" value="Ned" onclick="count_B.down()"/>
<!--tæller 2-->

<script type="text/javascript">
var count_A = new Counter("counting_A");
var count_B = new Counter("counting_B");
</script>


Jeg har valgt at instantiere de to tællere i en script blok efter de to felter counting_A og counting_B. Du kan også vælge at gøre det på onload. Det vigtige er, at felterne eksisterer, når objekterne instantieres.

PS: Navnene til tællerne og felterne er helt tilfældige. Du kan kalde dem, hvad du vil - jeg har bare valgt noget med _A og _B for tydelighedens skyld  =)
Avatar billede badazz Novice
19. september 2012 - 19:33 #6
Olebole, skal vi have lukket med et svar?
Avatar billede olebole Juniormester
19. september 2012 - 21:37 #7
Ellers tak, jeg samler ikke point. Læg selv et svar og accepter det, så tråden lukkes  =)
Avatar billede badazz Novice
08. november 2012 - 21:52 #8
ping
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 1 03/02/202614:19 03/02/202618:42
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Sæt vindue størrelse Af poulmadsen i JavaScript 1 08/10/202417:18 13/10/202412:33
Opgavestyring Af ingeman i JavaScript 1 15/09/202416:06 15/09/202420:40
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
31/0310:22 Makro der gemmer vedhæftet fil fra Msg og omdøber filen Af lokesa i Excel
30/0313:45 Kablet forbindelse mellem android telefon og windows 11 pc Af 1Dorte i Android
30/0312:04 Elementtype vises - og ikke billedet? Af hkprofil i Billedbehandling
29/0312:08 Problemer med replay af købte kursusvideoer Af annam i Browsere
28/0311:18 DENVER DVB-tMPEG-4 HD TUNER Af ole falsted i Fjernsyn & projektorer
White papers
Flere white papers »