Avatar billede para7 Nybegynder
20. juli 2004 - 15:43 Der er 14 kommentarer og
1 løsning

To live opdaterede tekster

Jeg har en Tip en ven side. Her taster den besøgende i fire formfelter sin vens navn og email og sit eget navn og email.

Disse felters tekst skal vises live opdaterede sat ind i eksempelteksten nedenfor formen. Det har kun lykkedes mig at strikke noget sammen gældende for ét tekstfelt, nemlig vennens navn. Der mangler eget navn [MitNavn] nederst. Her er min kode i en testside:

<html>
<head>
<title>Tip en ven</title>
<script language=javaScript>
var message = ""
function showText() {       
    if(document.all) {
        message=document.forms[0].elements[0].value
        Text.innerHTML=message
    }
    var timer=setTimeout("showText()",300)
}
</script>
</head>
<BODY onLoad="showText()">

<form action="TipEnven.asp?action=sendt" method="POST">
Min vens navn: <input type="text" name="VensNavn"> <br>
Min vens E-mail: <input type="text" name="VensEmail" ><br>
Mit navn: <input type="text" name="MitNavn"><br>   
Min E-mail: <input type="text" name="MinEmail" ><br>
<input type="submit">
</form>

Hej <span id="Text"> </span><br>
<br>
Du skulle prøve at besøge vores websted.<br>
<br>
<br>
Venlig hilsen<br>
[MitNavn]

</body>
</html>
Avatar billede roenving Novice
20. juli 2004 - 15:48 #1
Hvorfor skriver du kode, som ikke alle kan se, når det er tre bogstaver længere at skrive den så alle kan se det ?-)
Avatar billede roenving Novice
20. juli 2004 - 16:03 #2
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Vis indtastning</title>
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/521540">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:10px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
</style>
<script language="javascript" type="text/javascript">
function showText(f){
  if(f.VensNavn.value!="")document.getElementById('navn').innerHTML = f.VensNavn.value;
  if(f.MitNavn.value!="")document.getElementById('mitName').innerHTML = f.MitNavn.value;
  if(f.MinEmail.value!="")document.getElementById('minMail').innerHTML = f.MinEmail.value;
}
</script>
</head>

<body onresize onload>
<form action="TipEnven.asp?action=sendt" method="POST">
<table style="margin:15px;">
<tr><td>Min vens navn:</td><td> <input type="text" name="VensNavn" onkeyup="showText(this.form)"> </td></tr>
<tr><td>Min vens E-mail:</td><td> <input type="text" name="VensEmail"></td></tr>
<tr><td>Mit navn:</td><td> <input type="text" name="MitNavn" onkeyup="showText(this.form)"></td></tr>
<tr><td>Min E-mail:</td><td> <input type="text" name="MinEmail" onkeyup="showText(this.form)"></td></tr>
</table>
<input type="submit">
</form>
<div style="width:300px;background:#eee;padding:10px;">
Hej <span id="navn"> </span><br>
<br>
Du skulle prøve at besøge vores websted.<br>
<br>
<br>
Venlig hilsen<br>
<span id="mitName"></span><br>
(<span id="minMail"></span>)
</div>
</body>

</html>
Avatar billede para7 Nybegynder
20. juli 2004 - 16:12 #3
"Hvorfor skriver du kode, som ikke alle kan se, når det er tre bogstaver længere at skrive den så alle kan se det ?-)"

Tak for tippet, det er jo altså kun en testside. Siger du at det er bedst at have <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd"> i toppen af dokumenterne ?
Avatar billede para7 Nybegynder
20. juli 2004 - 16:25 #4
Og tak roenving for koden. Den virker helt som den skal, så send lige et svar for point :)
Avatar billede roenving Novice
20. juli 2004 - 16:25 #5
Det er bare en anden ting, for så arbejder selv Internet Explorer efter standarderne, så du har størst mulig chance for at siderne vises ens i alle browsere !-)

-- men det jeg hentydede til med den sætning, var dit brug af document.all ...

Ovenikøbet at udelukke brugere som har en browser, som ikke forstår et proprietært objekt, svarer nogenlunde til at udsende et nyhedsbrev world-wide på samisk ...

-- og som du kan se på mit eksempel er det slet ikke nødvendigt !-)

For du kan næsten ligeså nemt lave kode som forstås af _alle_ nutidige browsere ...
Avatar billede roenving Novice
20. juli 2004 - 16:26 #6
Velbekomme '-)
Avatar billede roenving Novice
20. juli 2004 - 16:51 #7
-- og tak for point ;~}
Avatar billede para7 Nybegynder
20. juli 2004 - 16:52 #8
Bare lige et sp:
<body onresize onload>
Hvis jeg skulle finde på at have flere ting til at ske onload, så plejer jeg at have onload="dit();dat()"
Hvordan gør jeg det med onresize onload, (som jeg ikke forstår)?
Avatar billede roenving Novice
20. juli 2004 - 16:54 #9
Det er fra mit standard-html-dokument, hvor jeg bare har de to eventhandlers til at ligge, fordi de tit følges ad i design som har absolut positionerede elementer ...

Så du skal bare:

<body onload="dit();dat()">
Avatar billede para7 Nybegynder
20. juli 2004 - 17:02 #10
Fint.
Der er lige en allersidste ting:
Når jeg genindtaster mig selv som afsender, ligger mit navn i dropdownen ved formfeltet. Hvis jeg eller den besøgende vælger det, så opdateres teksten ikke. Kun indtastet tekst synes at opdatere. Er det noget jeg må leve med. ?
Avatar billede roenving Novice
20. juli 2004 - 17:10 #11
Vi kan tilføje onchange også:

<tr><td>Min vens navn:</td><td> <input type="text" name="VensNavn" onkeyup="showText(this.form)" onchange="showText(this.form)"> </td></tr>

-- så burde den reagere !-)

Men der er nok ikke mange web-sites, som har et form-felt med navnet VensNavn, så genen er nok ikke så stor !o]
Avatar billede para7 Nybegynder
20. juli 2004 - 17:25 #12
Tak, men det var altså ikke nok. Jeg har prøvet on change, blur, focus, select. Ingen ændring. Det er en side for forforhandlere som kommer jævnligt ind og tipper en ven, og så er det bare lidt forvirrende at når de kommer igen og vælger deres navn, så udfyldes feltet ikke. Mange vil tro der er noget galt. Men OK, det kan nok ikke blive bedre. Og det er også end ikke at have live tekst funktionen.
Avatar billede para7 Nybegynder
20. juli 2004 - 17:28 #13
Hvordan er det nu man slår dropdownhukkommelsen fra et felt. Det er da en slags løsning.
Avatar billede para7 Nybegynder
20. juli 2004 - 17:47 #14
OK, jeg har sat autocomplete="off" på live-felterne. Nu har jeg også fået rigeligt for de 30 øre ;~)
Avatar billede roenving Novice
20. juli 2004 - 17:54 #15
Velbekomme, jeg måtte også lige søge noget for at finde det, for det havde jeg ikke lige husket ;O))
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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