Almacenamiento Local Jquery

Estoy trabajando en almacenamiento local usando jQuery. Tengo un campo de entrada en el que puedes escribir un texto, presionar Intro, actualizar y el texto sigue ahí. Así que eso está funcionando bien.

Pero quiero combinarlo con una función diferente que escribí. En esta función, un usuario puede hacer clic en un botón gris que luego lo “activará” para que se vuelva rojo y agregará un 1 al contenedor. Es un “botón me gusta”.

Entonces, ¿cómo puedo guardar la información del contador de clics (el botón se vuelve rojo y el valor se actualiza) utilizando el almacenamiento local?

Hice este jsfiddle: http://jsfiddle.net/Yazuri/7ZxMK/

jQuery(function ($) { if (typeof (window.localStorage) != "undefined") { $("input[type=text]").val(function () { return localStorage.getItem(this.id); }); $("input[type=text]").on("change", function () { localStorage.setItem(this.id, $(this).val()); }); } }); 

Aquí está su violín actualizado

  $("input[type=text]").each(function(){ $(this).val(localStorage.getItem(this.id)); }); $("input[type=text]").on("change", function () { localStorage.setItem(this.id, $(this).val()); }); 

No puede escribirlo de esta manera $("input[type=text]").val(function () {}) . No hay evento en val .

Puedes guardar los conteos desde los “corazones”.

Actualizado tu violín

JSFIDDLE

 $(document).ready(function () { $('.clickheart').click(function () { $(this).find(".output").html(function (i, val) { if (val < 1) { $(this).addClass('heartrood'); localStorage.setItem("hearts", val * 1 + 1); return val * 1 + 1; } else { $(this).removeClass('heartrood'); localStorage.setItem("hearts", val * 1 - 1); return val * 1 - 1; } }); }); }); 

Demo Fiddle

  1. Recupera y guarda el número total de clics.
    var result = $(".output").text(); localStorage.setItem('click', result);

  2. Si el almacenamiento local existe con la tecla, haga clic en mostrarlo en el div
    if (localStorage.getItem('click') != null) { $('.output').text(localStorage.getItem('click')); }

Espero eso ayude…!!