Je travaille sur le stockage local en utilisant jQuery. J’ai un champ de saisie dans lequel vous pouvez taper du texte, appuyez sur entrée, rafraîchir et le texte est toujours là. Donc ça marche bien.
Mais je veux le combiner avec une fonction différente que j’ai écrite. Dans cette fonction, un utilisateur peut cliquer sur un bouton gris qui “l’activera” pour qu’il devienne rouge et appenda un 1 au conteneur. C’est un “bouton semblable”.
Alors, comment puis-je enregistrer les informations du compteur de clics (le bouton devient rouge et la valeur mise à jour) à l’aide du stockage local?
J’ai fait ce jsfiddle: http://jsfiddle.net/Yazurei/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()); }); } });
Voici votre violon mis à jour
$("input[type=text]").each(function(){ $(this).val(localStorage.getItem(this.id)); }); $("input[type=text]").on("change", function () { localStorage.setItem(this.id, $(this).val()); });
Vous ne pouvez pas l’écrire de cette façon $("input[type=text]").val(function () {})
. Il n’y a pas d’événement sur le val .
Vous pouvez stocker les comptes des “coeurs”
Mis à jour votre violon
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; } }); }); });
Violon de démonstration
Récupérer et enregistrer le nombre total de clics
var result = $(".output").text(); localStorage.setItem('click', result);
Si le stockage local existe avec un clic sur la touche, affichez-le dans le fichier div.
if (localStorage.getItem('click') != null) { $('.output').text(localStorage.getItem('click')); }
J’espère que ça aide…!!