Checkbox
Spring til navigation
Spring til søgning
Hvordan anvendes en checkbox som input
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 |
Webdesign | |
---|---|
CSS | Placering - Egenskaber - Class - ID - Height - Width - Centrering - Margin - Border - Padding - Boksmodellen - Position - Text - Font - Farver - Backgruond - Table - List-style - Selectors - CSS3 - Media - Dropdown |
HTML | <b> - <br> - <em> - <strong> - <i> - <cite> - <q> - <tt> - <code> - <samp> - <kbd> - <var> - <pre> - <sub> - <sup> - <h1> - <h6> - <p> - <br> - <li> - <ol> - <ul> - <a> - <a> på siden - <img> - <map> - <object> - <dd> - <dl> - <dt> - <hr> - <div> - <span> - <html> - HTML5 - <head> - <title> - <body> - <frame> - <frameset> - <iframe> - <style> - <table> - <td> - <tr> - <th> - <tbody> - <thead> - <tfoot> - <form> - <input> - <textarea> - <label> - <select> - <option> - Radio button - Checkbox - Dropdown - Input text - Input password - Submit knap - Billede - Embedding Youtube - Kommentarer - Omdirigere |