Correct way to do HTML5 checkbox

Question

I can\'t seem to find an example anywhere... what\'s the correct way of doing a HTML5 checkbox?

Answer 1

A more complete example - and avoiding the long stream of posts to How to check whether a checkbox is checked in jQuery?.

HTML

<input id="your_id" name="your_name" value="your_value" type="checkbox">

Optionally add the 'checked' attribute to default to checked on load.

<input id="your_id" name="your_name" value="your_value" type="checkbox" checked>

JavaScript

$('#your_id').is(':checked')        // Returns a Boolean TRUE if checked

e.g.

if ($('#your_id').is(':checked')) {
    // Checkbox was checked
}

Answer 2

As far as I know and the docs state, nothing fundamental has changed. The basic markup is

<input name="your_name" value="your_value" type="checkbox">

What is new is some interesting properties.

• form - a reference to the form the control is associated with (nice!)
• autofocus - to be focused as soon as the document is loaded (nice!)
• required - require that it be checked (super nice! Although it isn't supported by Internet Explorer or Safari (yet).)