zoukankan      html  css  js  c++  java
  • Phonegap下localStorage使用实践

    HTML5的Web Storage API提供了两种客户端存储数据的方法

    localStorage和sessionStorage。 localStorage没有时间限制,程序升级也不会消失,可以满足持久化需求。

    设置localStorage的方法

     window.localStorage.setItem("likecolor","red");
    

    获得localStorage的方法

    window.localStorage.getItem("likecolor");
    

    完整的Code如下:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="msapplication-tap-highlight" content="no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
        <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *" />
        <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
        <script type="text/javascript" src="js/jquery.js"></script>
        <script  type="text/javascript" src="js/jquery.mobile-1.4.5.min.js"></script>
        <script type="text/javascript" charset="utf-8" src="cordova.js" ></script>
        <title>Hello World</title>
    
        <script type="text/javascript" charset="utf-8">
            document.addEventListener('deviceready', onDeviceReady, false);
            function onDeviceReady(){
                 $(".localStorageBtn").bind("click",function(event,ui){
                      setLocalStorage();
                 });
    
                 $(".showLocalStorageBtn").bind("click", function(event, ui ) {
                      getLocalStorage();
                 });
            }
    
             function setLocalStorage(){
                window.localStorage.setItem("likecolor","red");
             }
    
             function getLocalStorage(){
                 var item = window.localStorage.getItem("likecolor");
                 var info = document.getElementById("info");
                 info.innerHTML = item;
             }
        </script>
    </head>
    
    <body>
    <div id="page1" data-role="page" data-add-back-btn="true">
        <header data-role="header"><h1>Head</h1></header>
        <div data-role="content">
            <a data-role="button" class="localStorageBtn">set Local Storage</a>
            <a data-role="button" class="showLocalStorageBtn">get Local Storage</a>
            <p id="info"/>
        </div>
        <footer data-role="footer"><h1>Footer</h1></footer>
    </div>
    
    </body>
    
    </html>
    

      

  • 相关阅读:
    工具进阶:如何利用 MAT 找到问题发生的根本原因
    性能优化步骤
    搞定内存泄漏
    jvm配置示例
    vue的transition相同元素通过v-if,以及绑定key的区别
    安装nvm之node版本管理器
    在ts中定义变量类型的dva使用方法
    dva的全部用法
    react父子组件传值之二,ref传值(父组件调用子组件的值和方法) useRef+useImperativeHandle(hook)
    react父子组件传值方式一之props方法
  • 原文地址:https://www.cnblogs.com/linlf03/p/6656234.html
Copyright © 2011-2022 走看看