HTML5 form support for legacy browsers Here is formFive, a polyfill for your forms that makes some HTML5 form features available on older browsers. Download it! Demo (visit with a legacy browser)

Placeholder Want to make placeholders work on Internet Explorer? This plugin will provide you with a stylable placeholder text... even on password fields! Autofocus When used, your field will be automatically selected. Just use the autofocus attribute as it should and voilà. Alternative submits Want multiple submit buttons with different settings (action, enctype, method, target)? No problem! Form attribute If you need any form element to be outside of the <form> tag boundaries and still work, just add an attribute and you're done!

HTML5 forms for every browser!

Forms in HTML5 have a lot of very nice features, but unfortunately we often have to support older browsers. This polyfill checks for feature support and goes to work only if it has to. For instance, if a user is using Google Chrome, formFive won't do anything.

How to use it

Add the script tag

<script src="/js/jquery.formFive.min.js"></script>

Call formFive

$('#form-id').formFive({ placeholder: true, placeholderClass: 'phclass', autofocus: true, formaction: true, formenctype: true, formmethod: true, formtarget: true, formAttribute: true });

Keep in mind that all the parameters are optional. For instance, if your just want to use the autofocus feature, call formFive this way :

$('#form-id').formFive({ autofocus: true });

That's it! Of course you have to use the normal HTML5 attributes required for this to work.

HTML5 attributes to use

placeholder

<input type="text" placeholder="The placeholder text" />

By default, formFive adds a class to the input when it contains a placeholder text (so you can style how it looks). The default class is "placeholder", but you can specify a new class name by setting the placeholderClass option.

autofocus

<input type="text" autofocus="autofocus" />

formaction

<input type="submit" formaction="/otherpage.html" />

formenctype

<input type="submit" formenctype="multipart/form-data" />

formmethod

<input type="submit" formmethod="get" />

formtarget

<input type="submit" formtarget="_blank" />

form

<input type="text" form="form-id" />

Use the form attribute on an element outside of the boundaries of the <form> tag. That element will be included when the form submits.

More details

Want to have more details about the options? See the code? Fork it? Visit the formFive GitHub repository.