当前位置： 移动技术网 > IT编程>网页制作>Html5 > HTML5 本地存储 localStorage SessionStorage StorageListener- 2

HTML5 本地存储 localStorage SessionStorage StorageListener- 2

2018年02月19日  | 移动技术网IT编程  | 我要评论

%setion
  %p= "localStorage"
  %aside
    %ul
      %li
        %button.add= "添加数据"
      %li
        %button.get= "获取数据"
      %li
        %button.remove= "移除数据"
      %li
        %button.click= "清除数据"
      %li
        %button.parse= "解析JSON数据"
    %section.localStorage

 

 

 

pie={};

pie.load = function(func){
  jQuery(function(){
    try{
      func();
    }catch(e){
      console.log("PIE: js加载错误 " + e);
    }
  });
}

 


pie.load ->
 
  $userData = {
    name:"Sankyu Name",
    account:"sankyu",
    level:1,
    disabled:true
  }

  localStorage.getItem("userData")
 
  jQuery('.get').on 'click', ->
    $localStorage = jQuery('.localStorage')
    $localStorage.html(localStorage.getItem("userData"))

  jQuery('.add').on 'click', ->
    $localStorage = jQuery('.localStorage')
    localStorage.setItem("userData",JSON.stringify($userData))
    $localStorage.html("增加成功")

  jQuery('.remove').on 'click', ->
    localStorage.removeItem("userData")
    $localStorage = jQuery('.localStorage')
    $localStorage.html("删除成功")

  jQuery('.click').on 'click', ->
    localStorage.clear
    $localStorage = jQuery('.localStorage')
    $localStorage.html("已清除")

  jQuery('.parse').on 'click', ->
    $parse = JSON.parse(localStorage.getItem("userData")).name
    $localStorage = jQuery('.localStorage')
    $localStorage.html($parse)

jQuery(window).on 'load', ->
    window.addEventListener("storage",
      ((e) ->
        console.log(e)
        $storage = jQuery('p .storage')
        $storage.html("删除成功")
      ),true)
    localStorage.clear
    localStorage.setItem("userData","storage demo")
    localStorage.setItem("userData", "storge event demo")


 

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网