CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

dennisbjorn Juniormester

23. februar 2011 - 08:40 Der er 7 kommentarer og
1 løsning

Skriv numre i et felt

Hej,

Jeg har nedenstående kode, hvor man kan klikke på et 'nummertastatur' (bruges på touch skærm). Tal bliver skrevet i et felt 'varenr'.
Det fungerer i princippet ok, men problemet er, at hvis man taster/klikker to tal hurtigt lige efter hinanden, så bliver kun det første tal skrevet i feltet.

<html>
<script type="text/javascript">
function addNo(No) {
document.forms.BrugerForm.varenr.value=document.forms.BrugerForm.varenr.value+No;
}
</script>

<body>
<FORM name="BrugerForm">
<input type="text" maxlength="8" name="varenr" style="font-size:36px; width:280px;">
<br>
<input type="button" name="7" value="7" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('7');">
<input type="button" name="8" value="8" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('8');">
<input type="button" name="9" value="9" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('9');"><br>
<input type="button" name="4" value="4" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('4');">
<input type="button" name="5" value="5" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('5');">
<input type="button" name="6" value="6" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('6');"><br>
<input type="button" name="1" value="1" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('1');">
<input type="button" name="2" value="2" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('2');">
<input type="button" name="3" value="3" style="width:90px; height:90px; font-size:55px; background:#C2C4C7;" onClick="addNo('3');">
</FORM>
</body>
</html>

Synes godt om

webblaster2011 Nybegynder

24. februar 2011 - 15:40 #1

Hvis jeg var dig ville jeg bruge jquery. Så vil du kunne gøre der på følgende måde hvis du sørger for at alle dine knapper har denne class="callAddNum" og giver dit input felt dette id : id="varenr"

$('.callAddNum').click(function(){

$('#varenr').val($(this).attr('name'));

});

Synes godt om

intenz Novice

24. februar 2011 - 20:27 #2

#1. Det løser ikke problemet. Desuden erstatter du bare værdien af feltet med det du indtaster (og du har valgt feltets name, og ikke value).

#0
Det er relativt komplekst, da du, næsten, gør det på den simpleste måde. At du når at trykke en gang mere inden funktionen bliver kørt er ikke lige til at ændre. Det kan godt lade sig gøre, men det bliver betydelig mere komplekst.

Jeg ved ikke om problemet er stort nok til at retfærdiggøre det? Brugeren kan jo bare trykke på knappen igen.

Synes godt om

intenz Novice

24. februar 2011 - 20:34 #3

Du kan gøre det lidt mere effektivt ved at give varenr et id:
<input type="text" maxlength="8" name="varenr" id="varenr" style="font-size:36px; width:280px;">

Ændre alle dine input felter fra, f.eks.:
addNo('7');

til:
addNo(7);

Altså fjerne citationstegn.

Og så ændre din funktion til:
function addNo(No) {
var e = document.getElementById('varenr');
e.value = e.value+''+No;
}

Det vil, alt andet lige, være hurtigere at køre i browseren. Det vil ikke løse problemet helt, men måske få den til at køre hurtigt nok til, at man typisk ikke vil opleve problemet, selvom man trykker på 2 knapper hurtigt.

Synes godt om

intenz Novice

24. februar 2011 - 20:36 #4

Eller endnu bedre, lave funktionen som:

var e = document.getElementById('varenr');
function addNo(No) {
e.value = e.value+''+No;
}

Det er så ikke den kønne måde, ren syntax-mæssigt, men det vil være endnu hurtigere.

Synes godt om

dennisbjorn Juniormester

25. februar 2011 - 07:50 #5

intenz - din løsning virker helt perfekt:-))
Den er jeg super glad for!

Synes godt om

dennisbjorn Juniormester

25. februar 2011 - 10:41 #6

hmm..faktisk løser det ikke problemet helt (som du også selv nævner) - den er kun blevet en smule hurtigere.

Men hvis der nogle der har ide til løsning, hører jeg meget gerne...

Synes godt om

werd Nybegynder

25. februar 2011 - 11:40 #7

@dennisbjorn
Funktionen er ret hurtig, er du sikker på at det ikke er browseren eller nok endnu mere sandsynligt hardwaren der er din flaskehals?

Synes godt om

intenz Novice

27. februar 2011 - 19:53 #8

Eller måske 'onClick' eventen. Prøv at lav dem om til 'onmousedown'. Det vil få dine events til at blive kørt hurtigere. Jeg ved ikke om den fungerer med touch, men det vil jeg tro.

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

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
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
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23

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.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS