Checkbox: Forskelle mellem versioner

Nuværende version fra 6. dec. 2022, 22:37

Hvordan anvendes en checkbox som input

Eksempel på checkbox

En checkbox er et element, hvor man kan angive om det skal være checked eller ej.

Normalt anvendes det som en samling af elementer der hører sammen, og håndteres som sådan, men i princippet er det individuelle elementer.

En kode til checkboxen kan se ud som følger:

<form name="myForm">
Checkbox 1<input type="checkbox" id="inCheck1" /><br />
Checkbox 2<input type="checkbox" id="inCheck2" /><br />
Checkbox 3<input type="checkbox" id="inCheck3" /><br />
<input type="button" onClick="testFormular();" value="Test formularen">
<input type="reset" name="InRes" value="Reset" /><br />
</form>

input i checkbox med forslag til værdi

Man kan indstille så en eller flere af checkboxene er checked når siden loades:

Checkbox 1<input type="checkbox" id="inCheck1" /><br />
Checkbox 2<input type="checkbox" checked="checked" id="inCheck2" /><br />
Checkbox 3<input type="checkbox" checked="checked" id="inCheck3" /><br />

I programmeringssprog kaldes værdien for en default værdi.

Eksempel på anvendelse af input ved en checkbox

Når man klikker på knappen i eksemplet, så kaldes funktionen testFormular(), der ser ud som følger:

function testFormular() {
	
	// Værdien af de 3 checkboxe den modtages input på vises i en alert
	if (document.getElementById("inCheck1").checked) {
		alert("Checkboks 1 er sat");
	} else {
		alert("Checkboks 1 er ikke sat");
	}

	if (document.getElementById("inCheck2").checked) {
		alert("Checkboks 2 er sat");
	} else {
		alert("Checkboks 2 er ikke sat");
	}

	if (document.getElementById("inCheck3").checked) {
		alert("Checkboks 3 er sat");
	} else {
		alert("Checkboks 3 er ikke sat");
	}
	
	// Formen resettes for brugeren
	myForm.reset();
}

Filen med koden kan hentes i en zip-fil

Webcode
JavaScript	for - while - do while - for in - løkke - løkker i løkker - if - if-else - else-if - Conditional - Switch - break - continue - Funktion - Return - Returværdi - Rekursion - Sekvens - Javascript strukturer
js Input	Checkbox - Dropdown - Form - Input button - Input filter - Input password - Input text - Textarea - submit knap - Option - Prompt - Confirm - Radio button - Select - Input-Tag - Keyboard event
js Output	Alert - Document.write - Frameset output - Objekt egenskaber - Objekt output - Text-felt til output - Vindue output - Billed egenskaber - Canvas
js Syntaks	Arrays - Betingelse - Identifyer - Variabel - Variabel scope - Type - Sekvens
js Objekt	Canvas - Billed egenskaber - Egne objekter - Events - HTML-objekter - Keyboard event - Event-handler - Browser detektering - Preload images - Document Object Model
Tid i JavaScript	Date objektet - setTimeout - setInterval
PHP	Header - Include