HTML5 LocalStorage

- localstorage - contenteditable

by toubia95

HTML

<ul id="tobuy" contenteditable="true">
    <li>Ajouter un item</li>
</ul>
<button id="reset">Réinitialiser</button>

CSS

/* TODO */

/* ADD Code for external writing in js or php */
/* http://api.jquery.com/jQuery.ajax/ */
/* ref: http://www.c-point.com/JavaScript/articles/file_access_with_JavaScript.htm */

JavaScript

// sauvegarde du contenu lors du clic hors de la liste
var tobuy = document.getElementById('tobuy');
$("#tobuy").blur(function() {
    localStorage.setItem('tobuyData',this.innerHTML);
});

//récupération du contenu au chargement de page
if (localStorage.getItem('tobuyData')) {
    tobuy.innerHTML = localStorage.getItem('tobuyData');
}

//réinitialisation
$('#reset').click(function() {
    localStorage.clear();
    location.reload();
});