JSFiddle - React, Tailwind, and code Playground
by Victor
HTML
<textarea name="" id="" cols="30" rows="10"></textarea>
<br>
<small class="view"></small>
JavaScript
var autosave = function(elm, display, model){
var elm = document.querySelector(elm);
var display = document.querySelector(display);
var timer;
elm.addEventListener('keyup',function(){
if(timer) {
clearTimeout(timer);
};
timer = setTimeout(function(){
console.log('Saving...');
display.innerHTML = 'Saving...';
setTimeout(function(){
console.log('Done!');
display.innerHTML = 'Done!';
console.log(elm.value);
},3000)
},2500);
});
elm.addEventListener('keydown',function(){
display.innerHTML = 'Unsaved';
if(timer) {
clearTimeout(timer);
};
});
};
/* fire! */
autosave('textarea', '.view');