本地存储jQuery [英] Local Storage Jquery

问题描述

我正在使用jQuery进行本地存储.我有一个输入字段，您可以在其中输入一些文本，按Enter键，刷新，文本仍然存在.这样就可以了.

I'm working on local storage using jQuery. I've got an input field in which you can type some text, press enter, refresh and the text is still there. So that's working fine.

但是我想将其与我编写的其他功能结合起来.在此功能中，用户可以单击灰色按钮，然后将其激活"，使其变为红色，并向容器中添加1.这是一个赞按钮".

But I want to combine it with a different function I wrote. In this function a user can click on a grey button which will then "activate" it so it turns red, and it will add a 1 to the container. It's a "like button".

那么我该如何使用本地存储来保存点击计数器信息(按钮变为红色，并且值已更新)?

So how can I save the click counter information (button turning red, and value updated) using local storage?

我制作了这个jsfiddle: http://jsfiddle.net/Yazuri/7ZxMK/

I made this 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());
      });
  }
});

推荐答案

演示小提琴

1. 获取并保存总点击次数
   var result = $(".output").text(); localStorage.setItem('click', result);

1. Retrieve and save the total number of clicks
   var result = $(".output").text(); localStorage.setItem('click', result);

如果本地存储存在，则使用键 click 将其显示在div中
if (localStorage.getItem('click') != null) { $('.output').text(localStorage.getItem('click')); }

If the local storage exists with key click show it in the div
if (localStorage.getItem('click') != null) { $('.output').text(localStorage.getItem('click')); }

希望它能帮助... !!

Hope it helps...!!

这篇关于本地存储jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！