Avatar billede horizon Nybegynder
03. maj 2007 - 12:33 Der er 12 kommentarer og
1 løsning

skriv indtastede værdier mens der tastes

Jeg sidder og leger lidt med noget Javascript

Jeg prøver at lave en form hvor man skal indtaste sit navn og så med det samme så skriver den det man skriver et andet sted på siden

altså. nu siger vi jeg har en form der ser sådan ud:
<form action="#" name="SkrivForm">
Fornavn<br />
<input type="text" name="Fornavn" value="" />
Efternavn<br />
<input type="text" name="Efternavn" value="" />
</form>

og så vil jeg f.eks. længere nede i dokumentet have den til at skrive det man skriver UDEN at skulle reloade siden eller trykke på en knap

jeg har prøvet med følgende i selve input delen <input type="text" name="Fornavn" onkeypress="javascript(var Fornavn = this.value)" />

og så længere nede på siden har jeg prøvet med

setInterval(document.write.Fornavn, 100); men det vil ikke som jeg vil. hvad gør jeg galt?
Avatar billede crazysnap Seniormester
03. maj 2007 - 13:15 #1
Hej horizon,


Jeg har lavet et lille eksempel til dig som udfører din ønskede handling. Håber det er noget lignende det du leder efter:    :)



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
        <script type="text/JavaScript">
       
        </script>
    </head>
    <body>
        <table>
            <tr>
                <td>
                Fornavn:
                </td>
                <td>
                <input type="text" name="Fornavn" value="" onkeyup="document.getElementById('txtFornavn').value = this.value;"/>
                </td>
            </tr>
            <tr>
                <td>
                Efternavn:
                </td>
                <td>
                <input type="text" name="Efternavn" value="" onkeyup="document.getElementById('txtEfternavn').value = this.value;"/>
                </td>
            </tr>
        </table>     
        <div id="">
            <input id="txtFornavn" type="text" value="" style="border: 0px;"/><br />
            <input id="txtEfternavn" type="text" value="" style="border: 0px;"/>
        </div>
    </body>
</html>



Mvh.  :)

- Snap
Avatar billede olebole Juniormester
03. maj 2007 - 15:13 #2
<ole>

Lidt skidt eksempel, da
    document.getElementById('txtFornavn').value
- og:
    this.value

- slet ikke kan bruges i forbindelse med XHTML, hvor getElementById jo returnerer en DOM-node og ikke et HTML-element (eller rettere burde gøre det).
Faktisk kan det under XHTML slet ikke lade sig gøre at hente et tekstfelts value (hvis denne er blevet ændret af brugeren). At koden alligevel virker, skyldes ene og alene buggy browsere  =)

Skriv HTML4.01, så kan du også bruge forms og samtidig skrive nutidig, valid kode ... hvilket ellers først bliver muligt, når XHTML2.0 og XForms kommer på gaden - og er understøttet af browserne  ;o)

/mvh
</bole>
Avatar billede crazysnap Seniormester
03. maj 2007 - 15:28 #3
Hej igen,


Hov og ja det er fuldstændig korrekt hvad ole siger, havde helt overset at jeg havde pastet den doctype med, så hvis du ændrer de to første linjer til:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns="http://schemas.microsoft.com/intellisense/html-401"">


Burde alt være validt. :)


Mvh.

- Snap
Avatar billede olebole Juniormester
03. maj 2007 - 15:41 #4
En namespace-angivelse burde nok kunne undværes, når der ikke længere er tale om X(HT)ML. Namespaces giver kun mening under XML - eller et subset deraf  ;o)

Desuden vil den viste DTD få IE6+ til at i quirks mode, hvilket betyder at store, basale dele af CSS disables (hele box-modellen). Dette holder:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    ... osv - osv ...
Avatar billede roenving Novice
03. maj 2007 - 15:56 #5
IE6- !-)
Avatar billede olebole Juniormester
08. maj 2007 - 12:20 #6
roenving >> Så vidt jeg husker (har ikke testet), gælder DTD-switch'en stadig i IE7 - men bug'en "intet før DTD'en!" er blevet rettet. Ved du noget objektivt om, hvorvidt det er korrekt?  =)
Avatar billede roenving Novice
08. maj 2007 - 12:31 #7
Nej, jeg er ikke stødt ind i noget (og har heller ikke eftersøgt det !-), og har for nærværende ikke installeret den på den maskine, jeg bruger ...

-- min kommentar gik også udelukkende på, at også IE5'erne havde de bugs, i det omfang man overhovdet kunne få dem med på css !o]
Avatar billede horizon Nybegynder
21. maj 2007 - 21:47 #8
Hmm takker :D ... men er det muligt at få den til at skrive værdierne som ren tekst istedet for i en tekstboks?
Avatar billede roenving Novice
21. maj 2007 - 22:17 #9
Ja, så skal du lave en boks (f.eks. en span eller en div !-), gve den et id, sørge for at den indeholder en tekstnode fra start og så ændre den tekstnodes værdi, f.eks.

<div id="fornavn">&nbsp;</div>

-- og

<input type="text" name="Fornavn" value="" onkeyup="document.getElementById('fornavn').firstChild.nodeValue = this.value;"/>
Avatar billede horizon Nybegynder
26. maj 2007 - 18:03 #10
takker :D smid et svar
Avatar billede roenving Novice
26. maj 2007 - 22:33 #11
Er det mon ikke en deler ?-)

Velbekomme '-)
Avatar billede crazysnap Seniormester
26. maj 2007 - 22:46 #12
Hej igen,

Snup du dem bare! :)


Mvh.

- Snap
Avatar billede roenving Novice
28. maj 2007 - 09:37 #13
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
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