HTML Formular Egenskaber

Dette kapitel introducerer HTML <form> Forskellige egenskaber for elementer.

Action egenskab

action Egenskaber definerer den operation, der skal udføres ved indsendelse af formularen.

Normalt sendes formulardata til en fil på serveren, når brugeren klikker på "Indsend"-knappen.

I nedenstående eksempel sendes formulardata til en fil med navnet "action_page.php". Denne fil indeholder server-side script til behandling af formulardata:

Example

Efter indsendelse sendes formulardata til "action_page.php":

<form action="/action_page.php">
  <label for="fname">Fornavn:</label><br>
  <input type="text" id="fname" name="fname" value="Bill"><br>
  <label for="lname">Efternavn:</label><br>
  <input type="text" id="lname" name="lname" value="Gates"><br><br>
  <input type="submit" value="Submit">
</form>

Try it yourself

Påmindelse:Hvis action-attributten udelades, sættes action til den aktuelle side.

Target-egenskab

target Egenskaben bestemmer, hvor svaret vises efter indsendelse af formularen.

target Egenskaben kan indstilles til en af følgende værdier:

Værdi Description
_blank Svaret vises i et nyt vindue eller fane.
_self Svaret vises i det aktuelle vindue.
_parent Svaret vises i den overordnede ramme.
_top Svaret vises i vinduets hele body.
framename Svaret vises i det navngivne iframe.

Standardværdien er _self, hvilket betyder, at svaret vil blive åbnet i det aktuelle vindue.

Example

Her vil resultaterne blive åbnet i en ny browserfane:

<form action="/action_page.php" target="_blank">

Try it yourself

Method-egenskab

Method-egenskaben angiver den HTTP-metode, der skal bruges til at indsende formulardata.

Formulardata kan bruges som URL-variabler (brug method="get") eller som HTTP POST-transaktion (brug method="post") send.

Standard HTTP-metoden ved indsendelse af formulardata er GET.

Example

Dette eksempel bruger GET-metoden til at indsende formulardata:

<form action="/action_page.php" method="get">

Try it yourself

Example

Dette eksempel bruger POST-metoden til at indsende formulardata:

<form action="/action_page.php" method="post">

Try it yourself

Bemærkninger vedrørende GET:

  • Tilføj formulardata i form af navne/værdipar til URL'en
  • Brug aldrig GET til at sende følsomme data! (Indsendte formulardata er synlige i URL'en!)
  • URLens længde er begrænset (2048 tegn)
  • Meget nyttigt for formulardata, hvor brugeren ønsker at tilføje resultaterne som bogmærker
  • GET bruges til ikke-sikre data, såsom søgestring i Google

Bemærkninger vedrørende POST:

  • Tilføj formulardata til HTTP-anmodningens body (vis ikke indsendte formulardata i URL'en)
  • POST har ingen størrelsesbegrænsning og kan bruges til at sende store mængder data.
  • Formulardata med POST kan ikke tilføjes som bogmærke

Påmindelse:Hvis formulardata indeholder følsomme oplysninger eller personlige oplysninger, skal du nødvendigvis bruge POST!

Autocomplete-egenskab

autocomplete Egenskaben bestemmer, om formularen skal åbne automatisk fuldførelse.

Når automatisk fuldførelse er aktiveret, udfylder browseren værdier baseret på brugerens tidligere input.

Example

Aktiver automatisk udfyldning af formularen:

<form action="/action_page.php" autocomplete="on">

Try it yourself

Novalidate attribute

novalidate The attribute is a boolean attribute.

If set, it specifies that the form data should not be validated when submitted.

Example

Form without novalidate attribute set:

<form action="/action_page.php" novalidate>

Try it yourself

List of all <form> attributes

Attribute Description
accept-charset Specify the character encoding used for form submission.
action Specify where to send the form data when submitting the form.
autocomplete Specify whether the form should open the auto-complete (fill in) feature.
enctype Specify how to encode the form data when submitting it to the server (only for method="post").
method Specify the HTTP method to be used when sending form data.
name Specify the form name.
novalidate Specify that the form should not be validated when submitted.
rel Specify the relationship between the linked resource and the current document.
target Specify where to display the received response after submitting the form.