I'm creating a form where I'm eliminating the use of a save button. The form is made up of input text boxes and textareas. After the user enters data into the input field, I want to trigger an onBlur function and change the input into a span that contains the information that the user entered.

I also want to have the ability to edit this information, so if the user clicks on the newly created span with text, it will turn back into the input field with the current information for their editing pleasure.

For reference, I'm looking to have a functionality pretty much like on editing a photo title on Flickr.

If possible, I'd also like to have the textbox show "saving..." for half a second after the blur to reflect interaction with server.