美文网首页
如何使用localstorage存储搜索记录

如何使用localstorage存储搜索记录

作者: 悦者生存 | 来源:发表于2017-05-31 16:47 被阅读58次

    1.例子中使用了bootstrap框架,布局很简单

    出来后就是这个样子

    2.js部分如下

    下面是可复制版本

    //设置键数组

    varkey=[];

    //设置值数组

    varvalue=[];

    //设置第一个键值

    varfirstKey;

    //设置一个空字符串变量

    varhtml="";

    //初始化的函数

    functioninit() {

    //每次清空键,值数组

    key=[];

    value=[];

    //从本地存储中取数据

    html="";

    for(vari=0;i

    //循环localstorage,获取所有键值

    varnKey=localStorage.key(i);

    //因为我们设置的键值是以当前时间的距离1970年1月1日的毫秒数,所以判断一下

    if(Number(nKey)>100000){

    varnvalue=localStorage.getItem(nKey);

    key.push(nKey);

    value.push(nvalue);

    html+=""+nvalue+"";

    }

    }

    $(".record").html(html);

    }

    init();

    $(".btn").click(function() {

    //获取输入的值

    varval=$(".box").val();

    //获取当前时间

    varntime=(newDate()).getTime();

    //如果记录大于三条的话

    if(value.length>3){

    //获取第一个键值

    firstKey=key[0];

    //移除第一个记录

    localStorage.removeItem(firstKey);

    localStorage.setItem(ntime,val);

    }else{

    localStorage.setItem(ntime,val);

    }

    //每次都初始化一下

    init();

    });

    相关文章

      网友评论

          本文标题:如何使用localstorage存储搜索记录

          本文链接:https://www.haomeiwen.com/subject/pirjfxtx.html