New form attributes

Autofocus

With the attribute, you may focus one form control on page load. Previously, that can only be done with Javascript. In the example below, broswer focuses on the second text field.

Source Code Box: autofocus (Browser:IE10+, Firefox, Opera, Chrome, Safari)

focus on the second text field <input type="text" id="first"> <input type="text" id="second" autofocus value="me focused">

Multiple

With multiple attribute, you may select multiple files. You click “Browse” button and then select multiple files by pressing “Ctr” key.

Source Code Box: multiple (Browser:IE10+, Firefox, Opera, Chrome, Safari)

Please upload files. <input type="file" multiple>

Placeholder

In a search text box, you often find the hint like “input keywords here…”. You can do it now with placeholder attribute. Once you input sth. in the text field, the hint disappears.

Source Code Box: placeholder (Browser: IE10+,Firefox24+,Chrome29+,Safari5.1+,Opera17+,iOS3.2+,Android2.1+)

A search text field <input type="text" placeholder="Input keywords...."> <input type="submit" value="Search">

Required

If you specify one input field required, you cannot successfully submit it until you input some text in it. Please click submit button in example below.

Source Code Box: Required (Browser: IE10+, Firefox, Opera, Chrom)

<form action="#" id="form4" > Name:<input type="text" id="input4" required> <input type="submit" value="Submit"> </form>