LocalStorage ne fonctionne pas sur PhoneGap
- Je créer un exemple de LocalStorage. Lorsque j'utilise le navigateur web google Chrome, Il fonctionne très bien. Mais quand je l'ai tester sur Émulateur iPhone, Il ne le fait pas. S'il vous plaît aider.
Voici mon code pour définir le local de stockage de valeur:
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>
Voici le code où j'ai essayé d'obtenir les données enregistrées:
<!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:
Au Whizkid747 suggèrent, je change la source de script comme ci-dessous mais Ça ne fonctionne toujours pas.
<!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: Essayez de définir localStorage à OnDeviceReady puis obtenir à côté des lignes, mais ne fonctionne toujours pas.
<!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>
OriginalL'auteur Nguyen Minh Binh | 2013-03-24
Vous devez vous connecter pour publier un commentaire.
Déplacer votre code dans le document.prêt à onDeviceReady cas de PhoneGap. onDeviceReady est quand vous avez besoin pour commencer à exécuter votre code personnalisé.
Edit: *Essayer le code ci-dessous avec cordova.js ajoutée localement et non pas à partir de github*
Je vois que vous essayez d'obtenir des données de stockage local avant de le mettre. Pouvez-vous configurer les données dans deviceReady et obtenir ensuite dans la ligne suivante?
Veuillez voir mon edit2. J'ai mis localstorage à onDeviceReady et obtenir à côté de la ligne, ne fonctionne toujours pas.
Veuillez voir mon édité réponse: Essayez le code ajouté avec cordova.js ajoutée localement et non pas à partir de github.
OriginalL'auteur Whizkid747
Il y avait un problème lors de l'exécution de Cordova 2.1 (corrigé dans la version 2.2) sur iOS 6: l'initialisation de la localstorage la première fois que l'application est exécutée ne fonctionne pas.
Veuillez vérifier ceci pour une solution:
http://www.x-services.nl/cordova-localstorage-cleared-after-first-app-launch-ios6/369
OriginalL'auteur Sjoerd Huitema