Notifikationer

Markér alle som læst Log ud

kimborg Nybegynder

12. december 2006 - 11:08 Der er 18 kommentarer og
1 løsning

Tjek om caps lock er aktiveret

Hej, jeg skal bruge et script, som fortæller brugeren at caps lock er aktiveret, men jeg er ikke særlig skarp i javascript. Nogle som kan hjælpe??

Synes godt om

madeindk Nybegynder

12. december 2006 - 12:06 #1

Hej, jeg har fundet dette script til dig :-)

<script language="JavaScript">

function checkCapsLock( e ) {
var myKeyCode=0;
var myShiftKey=false;
var myMsg='Caps lock er slået tl';

// Internet Explorer 4+
if ( document.all ) {
myKeyCode=e.keyCode;
myShiftKey=e.shiftKey;

// Netscape 4
} else if ( document.layers ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;

// Netscape 6
} else if ( document.getElementById ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;

}

// Upper case letters are seen without depressing the Shift key, therefore Caps Lock is on
if ( ( myKeyCode >= 65 && myKeyCode <= 90 ) && !myShiftKey ) {
alert( myMsg );

// Lower case letters are seen while depressing the Shift key, therefore Caps Lock is on
} else if ( ( myKeyCode >= 97 && myKeyCode <= 122 ) && myShiftKey ) {
alert( myMsg );

}
}

</script>

På det felt du ønsker tjekke sætte på dette: onKeyPress="checkCapsLock(event);"

Synes godt om

kimborg Nybegynder

12. december 2006 - 12:37 #2

Hmm... det ser jo fint ud, men hvordan får jeg teksten frem ved siden af input-boksen istedet for en alert??

<input type="text" size="30" onKeyPress="checkCapsLock(event);">

Synes godt om

madeindk Nybegynder

12. december 2006 - 12:45 #3

Det kigger jeg lige på - giv mig 5 min :-)

Synes godt om

olebole Juniormester

12. december 2006 - 12:52 #4

<ole>

Ændringer:

checkCapsLock(this, event);

- og:

function checkCapsLock( oElm, e ) {

- og:

alert( myMsg );
- skal være:
oElm.setAttribute( "value", myMsg );

/mvh
</bole>

Synes godt om

madeindk Nybegynder

12. december 2006 - 12:56 #5

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<body>

<SCRIPT LANGUAGE="JavaScript">

function view(targetId){
if (document.getElementById){
target = document.getElementById( targetId );
if (target.style.display == "none"){
target.style.display = "";
} else {
target.style.display = "none";
}
}
}

function checkCapsLock( e ) {
var myKeyCode=0;
var myShiftKey=false;
var myMsg='Caps lock er slået tl';

// Internet Explorer 4+
if ( document.all ) {
myKeyCode=e.keyCode;
myShiftKey=e.shiftKey;

// Netscape 4
} else if ( document.layers ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;

// Netscape 6
} else if ( document.getElementById ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;
}

// Upper case letters are seen without depressing the Shift key, therefore Caps Lock is on
if ( ( myKeyCode >= 65 && myKeyCode <= 90 ) && !myShiftKey ) {

document.getElementById('capslock').style.display = 'block';

// Lower case letters are seen while depressing the Shift key, therefore Caps Lock is on
} else if ( ( myKeyCode >= 97 && myKeyCode <= 122 ) && myShiftKey ) {

document.getElementById('capslock').style.display = 'none';

}
}

</script>

<input type="text" size="30" onKeyPress="checkCapsLock(event);"> <b id="capslock" style="display:none;">Caps lock</b>

</body>
</html>

Synes godt om

olebole Juniormester

12. december 2006 - 12:56 #6

Sorry ... ved siden af input-feltet - ikke i feltet ;oD

<input type="text" size="30" onKeyPress="checkCapsLock('gnu', event);">
<span id="gnu"> </span>

function checkCapsLock( sID, e ) {

- og:

alert( myMsg );
- skal være:
document.getElementById(sID).firstChild.nodeValue = myMsg;

Synes godt om

olebole Juniormester

12. december 2006 - 12:57 #7

madeindk >> Sådan kan man også gøre det - men husk et validt script-tag ;o)
<script type="text/JavaScript">

Synes godt om

madeindk Nybegynder

12. december 2006 - 12:59 #8

Du har ret Ole - jeg retter lige lidt i det ;-)

Synes godt om

madeindk Nybegynder

12. december 2006 - 13:03 #9

<code>

<script language="javascript">

function checkCapsLock( e ) {
var myKeyCode=0;
var myShiftKey=false;
var myMsg='Caps lock er slået til...';

// Internet Explorer 4+
if ( document.all ) {
myKeyCode=e.keyCode;
myShiftKey=e.shiftKey;

// Netscape 4
} else if ( document.layers ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;

// Netscape 6
} else if ( document.getElementById ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;
}

// Upper case letters are seen without depressing the Shift key, therefore Caps Lock is on
if ( ( myKeyCode >= 65 && myKeyCode <= 90 ) && !myShiftKey ) {

document.getElementById('capslock').style.display = 'block';
document.getElementById('capslock').innerHTML = myMsg;

// Lower case letters are seen while depressing the Shift key, therefore Caps Lock is on
} else if ( ( myKeyCode >= 97 && myKeyCode <= 122 ) && myShiftKey ) {

document.getElementById('capslock').style.display = 'none';
document.getElementById('capslock').innerHTML = myMsg;

}
}

</script>

<input type="text" size="30" onKeyPress="checkCapsLock(event);"> <span id="capslock"> </span>

</code>

Ole du er også velkommen til at smide et svar ;-)

Synes godt om

olebole Juniormester

12. december 2006 - 13:24 #10

Husk et validt script-tag ;o)

innerHTML har aldrig været valid i nogen standard - og er desuden umulig at bruge under ægte XHTML (når det engang bliver aktuelt). Derfor brugte jeg:
document.getElementById('capslock').firstChild.nodeValue = myMsg;

- som er valid JS-DOM kode ;o)

Synes godt om

olebole Juniormester

12. december 2006 - 13:25 #11

- og nej tak til points, det var kun smårettelser ;o)

Synes godt om

madeindk Nybegynder

12. december 2006 - 13:25 #12

Ok, så lad os bruge det :-)

Har bare aldrig oplevet innerHTML ikke virkede i hverken IE6, IE7 eller FF 1 eller 2.

Synes godt om

kimborg Nybegynder

12. december 2006 - 13:33 #13

Tusind tak, men hvordan får jeg teksten "Caps lock er slået til" rykket op lige efter input-feltet og kan teksten forsvinde igen når man fjerner caps lock??

Sådan ser koden ud indtil videre:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test</title>
</head>

<body>

<script language="javascript">

function checkCapsLock( e ) {
var myKeyCode=0;
var myShiftKey=false;
var myMsg='Caps lock er slået til!';

// Internet Explorer 4+
if ( document.all ) {
myKeyCode=e.keyCode;
myShiftKey=e.shiftKey;

// Netscape 4
} else if ( document.layers ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;

// Netscape 6
} else if ( document.getElementById ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;
}

// Upper case letters are seen without depressing the Shift key, therefore Caps Lock is on
if ( ( myKeyCode >= 65 && myKeyCode <= 90 ) && !myShiftKey ) {

document.getElementById('capslock').style.display = 'block';
document.getElementById('capslock').firstChild.nodeValue = myMsg;

// Lower case letters are seen while depressing the Shift key, therefore Caps Lock is on
} else if ( ( myKeyCode >= 97 && myKeyCode <= 122 ) && myShiftKey ) {

document.getElementById('capslock').style.display = 'none';
document.getElementById('capslock').firstChild.nodeValue = myMsg;

}
}

</script>

<input type="text" size="30" onKeyPress="checkCapsLock(event);"> <span id="capslock"> </span>

</body>
</html>

Synes godt om

olebole Juniormester

12. december 2006 - 13:35 #14

madeindk >> Jamen, den virker skam også i alle de nævnte browsere - men det betyder ikke, den er valid. Når ægte XHTML bliver en realitet (i version 2.0) og når browserne engang begynder at understøtte standarden, bliver det umuligt at bruge innerHTML - som i øvrigt strider lodret mod hele W3C's DOM-tanke :)

XHTML er hverken understøttet i IE6 eller 7 - og FF understøtter XHTML mere eller mindre buggy. Bl.a. derfor er der utroligt få, der nogensinde har skrevet et XHTML-dokument, der faktisk parses og behandles som ægte XHTML (altså af browserens XML-fortolker) ;o)

Synes godt om

olebole Juniormester

12. december 2006 - 13:36 #15

kimborg >> Skidt lige:
<script language="javascript">

- ud med:
<script type="text/JavaScript">

;o)

Synes godt om

madeindk Nybegynder

12. december 2006 - 13:38 #16

Ok Ole, så ved jeg det :-) Jeg har sat det ind rettelse ind.

<code>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test</title>
</head>

<body>

<script type="text/JavaScript">

function checkCapsLock( e ) {
var myKeyCode=0;
var myShiftKey=false;
var myMsg='Caps lock er slået til!';

// Internet Explorer 4+
if ( document.all ) {
myKeyCode=e.keyCode;
myShiftKey=e.shiftKey;

// Netscape 4
} else if ( document.layers ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;

// Netscape 6
} else if ( document.getElementById ) {
myKeyCode=e.which;
myShiftKey=( myKeyCode == 16 ) ? true : false;
}

// Upper case letters are seen without depressing the Shift key, therefore Caps Lock is on
if ( ( myKeyCode >= 65 && myKeyCode <= 90 ) && !myShiftKey ) {

document.getElementById('capslock').style.display = 'block';
document.getElementById('capslock').firstChild.nodeValue = myMsg;

// Lower case letters are seen while depressing the Shift key, therefore Caps Lock is on
} else if ( ( myKeyCode >= 97 && myKeyCode <= 122 ) && myShiftKey ) {

document.getElementById('capslock').style.display = 'block';
document.getElementById('capslock').firstChild.nodeValue = myMsg;

}
else
{

document.getElementById('capslock').style.display = 'none';
}
}

</script>

<input type="text" size="30" onKeyPress="checkCapsLock(event);"> <span id="capslock" style="position:absolute; padding-top:3px;"> </span>

</body>
</html>

</code>

Synes godt om

kimborg Nybegynder

12. december 2006 - 13:42 #17

Super!!!

Tak begge to

Synes godt om

madeindk Nybegynder

12. december 2006 - 13:46 #18

Det var så lidt - takker for point :-)

Synes godt om

olebole Juniormester

12. december 2006 - 13:58 #19

- og selvtak ;o)

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
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript	5	27/04/202620:09	03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript	8	14/04/202610:11	20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript	2	03/02/202614:19	04/04/202616:02
Å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

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