Brugere lige nu: 1
Siden er opdateret 28. 1. 2009
Herunder ser du en formular, der fungerer som en simpel mail-editor. Når der af brugeren klikkes på Send mail, sendes mailen videre til brugerens mailprogram, hvorfra det kan sendes. Formularen sender også en kopi af mailen til afsenderens adresse.
Funktionen består af to dele:
Jeg vil lige vise et par detaljer, der har betydning for formularens funktion:
Formularens begyndelsestag:
<form method="post" action="#">
Læg her mærke til, at der ikke er defineret, hvad der skal ske ved submit (klik på Send mail) - action er tom. Det defineres i javascriptet i stedet.
Submit-knappens kald til javascriptet:
<input type="button" value=" Send mail " onclick="maildata(this.form)" />
Læg her mærke til, at submit-knappen ikke er defineret som type="submit", men som type="button". Dette er for at kunne definere i et javascript, hvad der skal ske ved klik på knappen.
JavaScriptet ser sådan ud:
<script type="text/javascript">
function maildata(formdata)
{
bruger = 'navn'
domaene = 'domæne'
topdomaene = 'dk'
emailadresse = bruger+'@'+domaene+'.'+topdomaene
location.href = 'mailto:' + emailadresse + '?cc=' + formdata.email.value + ' &subject=' + formdata.emne.value + '&body=' + formdata.afs.value + escape(' \n') + formdata.navn.value + escape(' \n\n') + formdata.eml.value + escape(' \n') + formdata.email.value + escape(' \n\n') + formdata.msg.value + escape(' \n') + formdata.tekst.value;
}
</script>
Der sker dette:
Scriptet modtager via onclick-kommandoen maildata(this.form) i formularen de indtastede data navn, email, emne og tekst og samler dem til en mail, der sendes til adressen i location.href. Endvidere sendes en kopi af mailen til den afsenderadresse, som brugeren har indtastet - dette sker med koden ?cc=' + formdata.email.value + '.
Og endelig ser hele formularen sådan ud:
<form method="post" action="#">
<fieldset>
<legend>Husk at udfylde alle felter</legend>
<input type="hidden" name="afs" value="Navn:" />
<input type="hidden" name="eml" value="Email:" />
<input type="hidden" name="msg" value="Besked:" />
<label for="t1">navn:</label>
<input id="t1" type="text" size="80" name="navn" /><br />
<label for="t2">Email:</label>
<input id="t2" type="text" size="80" name="email" /><br />
<label for="t3">Emne:</label>
<input id="t3" type="text" size="80" name="emne" /><br />
<label for="t4">Besked:</label>
<textarea id="t4" rows="8" cols="80" name="tekst"></textarea><br />
<label for="t5"> </label>
<input id="t5" type="button" value=" Send mail " onclick="maildata(this.form)" />
<input type="reset" value=" Slet alt " />
</fieldset>
</form>
Læg mærke til de tre <input type="hidden" .., der tilføjer lidt tekst i den afsendte email. Denne emails body så vil se nogenlunde sådan ud:
Navn:
Afsenderens navn (indtastet i første felt)
Email:
navn@domæne.dk (indtastet i andet felt)
Besked:
Teksten (indtastet i det store felt nederst)
Bemærk, at hvis brugeren ser siden med formularen i Mozilla og hvis brugeren også har installeret Mozillas mailklient, kommer der desværre ikke de planlagte linjeskift i mailen. Er Mozilla-brugerens defaulte mailprogram derimod Outlook Express, ser det rigtigt ud.
Bemærk endvidere, at Mozilla under alle omstændigheder ikke kan sende danske tegn rigtigt. Dette er muligvis noget tegnsætfejl.
Se også siden om at kode en e-mailadresse. De to teknikker kan kombineres, hvis du synes.