2013-03-24 25 views
5

Tworzę przykład LocalStorage. Kiedy używam przeglądarki Chrome, działa dobrze. Ale kiedy testuję na emulatorze iPhone'a, to nie działa. Proszę pomóż. Oto mój kod, aby ustawić wartość lokalnego przechowywania:LocalStorage nie działa na PhoneGap

function onclick(){ 
    window.localStorage.setItem("data","Nguyen Minh Binh"); 
} 

===========

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Page Title</title> 

     <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script src="cordova-2.5.0.js"></script> 

      <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css" /> 
      <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
      <script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script> 
      <script src="js/index.js" type="text/javascript" ></script> 
    </head> 

    <body> 
     <a data-role="button" href="DemoWOrklightJQM/index.html" data-prefetch onclick="onclick()">Click me</a> 
    </body> 
</html> 

Oto kod, gdzie starałem się dostać zapisane dane:

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
      <title>DemoSimpleControls</title> 
      <meta name="viewport" 
       content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> 
       <link rel="shortcut icon" href="images/favicon.png"> 
        <link rel="apple-touch-icon" href="images/apple-touch-icon.png"> 
         <link href="jqueryMobile/jquery.mobile-1.3.0.css" rel="stylesheet"> 
          <link rel="stylesheet" href="css/DemoSimpleControls.css"> 
           <script> 
            window.$ = window.jQuery = WLJQ; 
            </script> 
           <script src="jqueryMobile/jquery.mobile-1.3.0.js"></script> 
           <script src="../js/jquery-1.9.1.min.js"></script> 
           <script> 
            $(document).ready(function(){ 
                 $("#mysavedData").html("XYZ"); 
                 $("#mysavedData").html(window.localStorage.getItem("data")); 
                 }); 

           </script> 
           </head> 

    <body id="content" > 
     <div data-role="page" id="page"> 
      <div data-role="header" > 
       <a data-rel="back" href="#" >Back</a> 
       <h1>My page</h1> 

      </div> 
      <div data-role="content" style="padding: 15px" data-theme="e"> 
       <div id="mysavedData">My data</div> 

         <a href="#" onclick="getData(); return false;" data-role="button" id="button" data-theme="a" data-icon="home" data-iconpos="left" data-corners="true">Button</a> 
      </div> 

     </div> 
    </body> 
</html> 

EDIT: na Whizkid747 sugerują, że zmiany źródła skryptu jak poniżej, ale nadal nie działa.

 <!DOCTYPE HTML> 
    <html> 
     <head> 
      <meta charset="UTF-8"> 
       <title>DemoSimpleControls</title> 
       <meta name=" 

viewport" 
       content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> 
       <link rel="shortcut icon" href="images/favicon.png"> 
        <link rel="apple-touch-icon" href="images/apple-touch-icon.png"> 
         <link href="jqueryMobile/jquery.mobile-1.3.0.css" rel="stylesheet"> 
          <link rel="stylesheet" href="css/DemoSimpleControls.css"> 

           <script src="jqueryMobile/jquery.mobile-1.3.0.js"></script> 
           <script src="../js/jquery-1.9.1.min.js"></script> 
           < script type="text/javascript" charset="utf-8" src="../cordova-2.5.0.js"></script> 
           <script type="text/javascript" charset="utf-8"> 
            function onLoad(){ 
             document.addEventListener("deviceready", deviceready, false); 
            } 
            function deviceready(){ 
             $("#mysavedData").html("XYZ"); 
             $("#mysavedData").html(window.localStorage.getItem("data")); 
            } 

           </script> 
           </head> 

    <body id="content" onLoad="onLoad();" > 
     <div data-role="page" id="page"> 
      <div data-role="header" > 
       <a data-rel="back" href="#" >Back</a> 
       <h1>My page</h1> 

      </div> 
      <div data-role="content" style="padding: 15px" data-theme="e"> 
       <div id="mysavedData">My data</div> 

         <a href="#" onclick="getData(); return false;" data-role="button" id="button" data-theme="a" data-icon="home" data-iconpos="left" data-corners="true">Button</a> 
      </div> 

     </div> 
    </body> 
</html> 

EDIT2: Spróbuj ustawić localStorage na OnDeviceReady następnie dostać kolejne linie, ale nadal nie działa.

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Contact Example</title> 
     <script src="js/jquery-1.9.1.min.js"> 
      </script> 
     <script type="text/javascript" charset="utf-8" src="cordova-2.5.0.js"></script> 
     <script src="https://raw.github.com/phonegap/phonegap/2.5.0rc1/lib/android/cordova-2.5.0rc1.js"></script> 
     <script type="text/javascript" charset="utf-8"> 

      // Wait for PhoneGap to load 
      // 
      document.addEventListener("deviceready", onDeviceReady, false); 

      // PhoneGap is ready 
      // 
      function onDeviceReady() { 
       window.localStorage.setItem("key", "minhbinh"); 
       var keyname = window.localStorage.key(i); 
       // keyname is now equal to "key" 
       var value = window.localStorage.getItem("key"); 
       // value is now equal to "value" 
       window.localStorage.removeItem("key"); 
       window.localStorage.clear(); 
       // localStorage is now empty 
       $("p#p1").text(value); 
      } 


      </script> 
    </head> 
    <body> 
     <h1>Example</h1> 
     <p id="p1">localStorage</p> 
    </body> 
</html> 

Odpowiedz

6

Przenieś swój kod w document.ready do onDeviceReady event of PhoneGap. onDeviceReady to moment, w którym należy rozpocząć wykonywanie niestandardowego kodu.

Edit: * Wypróbuj poniższy kod z cordova.js dodanych lokalnie, a nie z github *

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Contact Example</title> 
     <script src="js/jquery-1.9.1.min.js"> 
      </script> 
     <script type="text/javascript" charset="utf-8" src="cordova-2.5.0.js"></script> 
     <script src="cordova-2.5.0rc1.js"></script> 

    </head> 
    <body> 
     <h1>Example</h1> 
     <p id="p1">localStorage</p> 
     <script type="text/javascript"> 

      // Wait for PhoneGap to load 

      document.addEventListener("deviceready", onDeviceReady, false); 

      // PhoneGap is ready 

      function onDeviceReady() { 
       window.localStorage.setItem("key", "minhbinh"); 
       var keyname = window.localStorage.key(i); 
       // keyname is now equal to "key" 
       var value = window.localStorage.getItem("key"); 
       // value is now equal to "value" 
       //window.localStorage.removeItem("key"); 
       //window.localStorage.clear(); 
       // localStorage is now empty 
       $("p#p1").text(value); 
      } 


     </script> 
    </body> 
</html> 
+0

Proszę zobaczyć moje zmienił. Zmieniłem kody jako sugestię, ale to nie działa. –

+0

Widzę, że próbujesz uzyskać dane z pamięci lokalnej przed jej ustawieniem. Czy możesz ustawić dane w zdarzeniu deviceReady, a następnie uzyskać je w następnym wierszu? – Whizkid747

+0

Proszę zobaczyć moje edit2. Ustawiłem localstorage na onDeviceReady i otrzymam następną linię, nadal nie działa. –