Jquery plugin for temp drafts in forms

jquery-draft.js

/*global $,localStorage*/
$.fn.draft = function () {
    'use strict';

    if (!localStorage) {
        return;
    }

    var form = $(this),
        fields = form.find('input,select,textarea'),
        keyFor = function (field) {
            return form.attr('id') + $(field).attr('name');
        },
        clearFields = function () {
            fields.each(function (index, field) {
                localStorage.removeItem(keyFor(field));
            });
        },
        saveField = function () {
            localStorage.setItem(keyFor(this), $(this).val());
        },
        recoverField = function (index, field) {
            var value = localStorage.getItem(keyFor(field));
            if (value) {
                $(field).val(value);
            }
        };

    form.on('submit', clearFields);
    fields.on('change', saveField).each(recoverField);
};

jQuery Draft Plugin

Remember changes on form fields by saving them on localStorage

Usage

You will need a modern browser with localStorage support and jQuery

<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="jquery-draft.js"></script>
<script>
    $('form').draft();
</script>