Søg
Avatar billede kwudo Nybegynder
16. juli 2007 - 19:57 Der er 19 kommentarer og
1 løsning

Test om det langt nok?

Hej alle sammen, jeg leder efter en kode i javascript der tester om noget der er skrevet i et input felt i html er langtnok, f.x. om det password der er skrevet er mere end 6 langt.

Dette skal ske før man trykker "videre", f.x. ligesom de der password testere, så stiger den jo til mellem efterhånden som koden bliver mere advanceret, kan man os gøre det med længden af ens password?

Altså så der er et billede der først er rødt og når man så har skrevet 6 tegn, så bliver den grøn?
Avatar billede tonse Nybegynder
16. juli 2007 - 21:28 #1
Måske kan du bruge det her:
<html>
<head>
<title>TestPassword</title>

<script type="text/javascript">
function testPass(){
    if (document.getElementById('pass').value.length < 6) {
    document.getElementById('passDiv').style.color = "#ff0000";
    }
    else {
    document.getElementById('passDiv').style.color = "#00ff00";
    document.getElementById('passDiv').innerHTML = "Sådan!";
    }
}
</script>
</head>

<body>
<form id="testForm">
<div id="passDiv" style="color: #ff0000;">Skriv password:</div>
<input type="password" id="pass" onKeyDown="testPass();" />
<input type="submit" value="Submit" />
</form>
</body>
</html>

Den ændrer teksten der står uden foran password boxen når man har skrevet over 6 tegn.
Avatar billede olebole Juniormester
17. juli 2007 - 12:29 #2
<ole>

Mon ikke brugeren bliver forvirret, når siden fortæller ham, at alt er fint, når han har tastet 6 af tegnene i det 10-tegns password, han ville have skrevet?

<script type="text/JavaScript">
function validate(oForm) {
    if (oForm.pass.value.length<6) {
        alert("Kodeordet skal være på mindst 6 tegn.");
        oForm.pass.focus();
        return false;
    }
    return true;
}
</script>

<form id="testForm" onsubmit="return validate(this)">
<div>Password</div>
<input type="password" name="pass">
<input type="submit" value="Submit">
</form>

I øvrigt er det vigtigt, at et formfelt har en name-attribute - og ikke 'kun' en id. Ellers kan du ikke finde den tilsvarende variabel på serveren.

Når JS-koden ikke er kompatibel med XHTML, er der ingen grund til at skrive XHTML-markup - så det har jeg også rettet  =)

/mvh
</bole>
Avatar billede kwudo Nybegynder
17. juli 2007 - 15:12 #3
har vidst ikke udtrykt mig klart nok, der skal ikke komme en alert når du trykker.
der skal være en rød lille prik, som er et billede og så snart man har indtastet 6 tegn skal den blive til et grønt billede uden man skal klikke på submit
Avatar billede kwudo Nybegynder
17. juli 2007 - 15:16 #4
Arh, pinligt :D
Fik dit til at virke, tonse. Smid svar :)
Avatar billede kwudo Nybegynder
17. juli 2007 - 15:32 #5
men tonse hvordan gør man så sådan at hvis man sletter en felt i passwordet så man er tilbage på 5 tegn, så der kommer til at stå Skriv password: med rødt igen?
Avatar billede kwudo Nybegynder
17. juli 2007 - 15:41 #6
<script type="text/javascript">
function testPass(){   

    if (document.getElementById('password').value.length > 6) {
    document.getElementById('passwordDiv').style.color = "#00ff00";
    document.getElementById('passwordDiv').innerHTML = "Y";
    }
    else {
    document.getElementById('passwordDiv').style.color = "#ff0000";
    document.getElementById('passwordDiv').innerHTML = "N";
    }
   
    if (document.getElementById('password').value.length < 6) {
    document.getElementById('passwordDiv').style.color = "#ff0000";
    document.getElementById('passwordDiv').innerHTML = "N";
    }
    else {
    document.getElementById('passwordDiv').style.color = "#00ff00";
    document.getElementById('passwordDiv').innerHTML = "Y";
    }
   
}
</script>

har lavet dette, men den opdatere først når man har skrevet seks, og så trykker tilside med en af piletasterne, eller skriver 7 tegn :/
Avatar billede olebole Juniormester
17. juli 2007 - 15:49 #7
Undgå for alt i verden innerHTML. Skriv i stedet:
    document.getElementById('passwordDiv').firstChild.nodeValue = "Y";
Avatar billede kwudo Nybegynder
17. juli 2007 - 16:05 #8
så det gjort, men løste nu ik rigtig mit problem :/
Avatar billede mclemens Nybegynder
17. juli 2007 - 18:22 #9
Ret Tonse's onkeydown til onkeyup.
Det samme er nok også fejlen i din.
Avatar billede mclemens Nybegynder
17. juli 2007 - 18:27 #10
Eller rettere måske skal
if (document.getElementById('password').value.length > 6) {
rettes til if (document.getElementById('password').value.length > 5) {
i din.

Et eksempel på din kan nok lyde sådan:



<html>
<head>
<title>TestPassword</title>

<script type="text/javascript">
function testPass(e){ 
  el=e.value.length;
  pd=document.getElementById('passwordDiv');
  pd.style.color =el>5?"#0f0":"#f00";
  pd.firstChild.nodeValue =el>5?"Y":"N";
}
</script>
</head>

<body>
<form id="testForm">
<div id="passwordDiv" style="color: #ff0000;">N</div>
<input type="password" id="pass" name="pass" onkeyup="testPass(this);" />
<input type="submit" value="Submit" />
</form>
</body>
</html>
Avatar billede mclemens Nybegynder
17. juli 2007 - 18:32 #11
Hmm, der er egentlig ikke grund til at spørge på om el er
over 5 to gange, så scriptet i ovenstående kan istedet skrives som:

<script type="text/javascript">
function testPass(e){
  el=(e.value.length>5);
  pd=document.getElementById('passwordDiv');
  pd.style.color =el?"#0f0":"#f00";
  pd.firstChild.nodeValue =el?"Y":"N";
}
</script>
Avatar billede kwudo Nybegynder
18. juli 2007 - 10:52 #12
mclemens den skifter ik farve?
Avatar billede mclemens Nybegynder
18. juli 2007 - 11:40 #13
17/07-2007 18:27:30 & 17/07-2007 18:32:57
Skifter fint farve her ? Kopierer du
markup'en direkte eller har du rettet lidt
i det ? Hvilken browser kører du med ?

Hvis det er et rettet eksempel, så
kast evt. den du har problemer med ...
Avatar billede tonse Nybegynder
19. juli 2007 - 13:41 #14
Det virker også fint her. Undskyld det sene svar, det gik lidt hurtigt da jeg skriv mit indlæg. Selvfølgelig skulle der have stået at length < 5.. så ville det have virket. Men mclemens virker da fint! du kan oven i købet kopiere direkte... men læg et eksempel op af din kode, så kan vi se om vi kan rette det!
Avatar billede mclemens Nybegynder
19. juli 2007 - 13:55 #15
Tonse det skal ikke være <5 i dit eksempel.
< 6 er rigtigt i din udgave, da det er under 6 at det skal blive rødt.
Kwudo's 17/07-2007 15:41:03 spurgte på om det var over 6, mens den skulle
spørge på om det var over 5 istedet. ( < 6 vs. > 5 ). Fejlen i din var blot
det med at value.length blev beregnet ved onkeydown og derfor ikke slog igennem
på samme måde, som hvis det havde været onkeyup handleren. (blot for at uddybe).
Avatar billede tonse Nybegynder
19. juli 2007 - 14:41 #16
uhh... jeg er træt.. mente udover det også <= 5, men jo havde selvfølgelig taget de andres kritik med i min overvejelse!

Men din kode virker jo, så giv gas, du har svaret :)
Avatar billede mclemens Nybegynder
19. juli 2007 - 15:38 #17
^ Hmm, synes også du burde kaste et svar Tonse,
det var kun en lille rettelse der manglede på din. ;)

Og synes også Olebole kan kaste for 17/07-2007 15:49:47.

Men anyway, det er spørgers valg. Lagkagen er stor nok til
at dele for mit vedkommende. (jeg er p.t. lidt buttet i forvejen).
... ( Kwudo, husk at kaste din kilde, hvis den giver dig kvaler )
Avatar billede olebole Juniormester
19. juli 2007 - 17:46 #18
Det er Jer andre, der har taget 'slæbet' i denne tråd, så I æder kagen ... men tak for tanken  ;o)
Avatar billede kwudo Nybegynder
21. juli 2007 - 14:50 #19
i
Avatar billede mclemens Nybegynder
21. juli 2007 - 23:04 #20
Tak for point :)
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
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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
07/0514:15 PHP Html Af Asky i Programmeringsværktøjer
07/0511:06 Rufus mange muligheder - valg ved install Windows Af Uvanga i Windows
06/0516:53 HTML Af Asky i Programmeringsværktøjer
06/0510:01 Mister internettet efter slumre, Af valby i Windows
05/0513:02 Lille smart tingest Af nu_igen i Fitness & Smartwatches
White papers
Flere white papers »