Javascript Phonegap Jquery手机将数据保存到手机_Javascript_Jquery_Cordova_Jquery Mobile

Javascript Phonegap Jquery手机将数据保存到手机

javascript jquery cordova jquery-mobile

Javascript Phonegap Jquery手机将数据保存到手机,javascript,jquery,cordova,jquery-mobile,Javascript,Jquery,Cordova,Jquery Mobile,我在尝试下面简单的东西。我想接受用户输入他们的名字，点击一个按钮保存它，当应用程序第二次加载时，它会显示名字我到底哪里出了问题我需要把这个代码块放到别的地方吗 <script type="text/javascript"> $(function(){ $('#saveButton').click(function() { window.localStorage.setItem("name", $('#name').val()); }); $('#new

我在尝试下面简单的东西。我想接受用户输入他们的名字，点击一个按钮保存它，当应用程序第二次加载时，它会显示名字

我到底哪里出了问题

我需要把这个代码块放到别的地方吗

 <script type="text/javascript">

$(function(){
$('#saveButton').click(function() {
        window.localStorage.setItem("name", $('#name').val());
});
    $('#newpage').live('pageshow', function() {
        var personName = window.localStorage.getItem("name");
        if(personName.length>0){
                $('#name').val(personName);
        }
    });

});
</script>


$（函数（）{
$（“#保存按钮”）。单击（函数（）{
window.localStorage.setItem（“name”，$（“#name”）.val（）；
});
$（'#newpage'）.live（'pageshow'，function（））{
var personName=window.localStorage.getItem（“名称”）；
如果（personName.length>0）{
$（'#name'）.val（人名）；
}
});
});

完整html文件

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.2.0.css" />
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript" src="jquery.mobile-1.2.0.js"></script>


<script type="text/javascript">

$(function(){
$('#saveButton').click(function() {
        window.localStorage.setItem("name", $('#name').val());
});
    $('#newpage').live('pageshow', function() {
        var personName = window.localStorage.getItem("name");
        if(personName.length>0){
                $('#name').val(personName);
        }
    });

});
</script>


<title>Hello World</title>
</head>
<body>
<div id="home" data-role="page">
    <div data-role="header">
        <h1>
            Home Page</h1>
    </div>
    <div data-role="content">
        hello Phone Gap and JQuery Mobile! <a href="#newpage" data-role="button">new page</a>
    </div>
    <div data-role="footer" data-position="fixed">
        <h4>
            footer</h4>
    </div>
</div>


<div id="newpage" data-role="page">
    <div data-role="header">
        <h1>
            new Page</h1>
    </div>
    <div data-role="content">
        <label for="name">what is your name?</label>
        <input id="name" type="text" name="name" value="" />
        <a id="saveButton" href="" data-role="button">Save</a>
    </div>
    <div data-role="footer" data-position="fixed">
        <h4>
            footer</h4>
    </div>
</div>
<script type="text/javascript" src="cordova-2.1.0.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
    app.initialize();
</script>
</body>
</html>


$（函数（）{
$（“#保存按钮”）。单击（函数（）{
window.localStorage.setItem（“name”，$（“#name”）.val（）；
});
$（'#newpage'）.live（'pageshow'，function（））{
var personName=window.localStorage.getItem（“名称”）；
如果（personName.length>0）{
$（'#name'）.val（人名）；
}
});
});
你好，世界
主页
你好，电话Gap和JQuery Mobile！
页脚
新页
你叫什么名字？
页脚
app.initialize（）；

是的，您需要在

pageinit

事件中放置按钮单击事件连接-他们甚至在

对于iOS设备测试：如果您的更改没有反映在您的设备上，请确保在部署之前触摸您的文件。Phonegap的默认项目模板已经做到了这一点，但他们的命令对我不起作用。见我的答案：

小更正

.val

应该是

.html

。请参阅下面的代码

$('#my_name').html(personName);

加：

谢谢你给我一次机会。我重新编译了，但仍然没有保存我的名字。在我重新访问应用程序后，它还没有显示。请确保重新编译的文件确实被复制，我曾经遇到过这样的问题-您真的想检查它。：）查看我的编辑-抱歉，忘记移动pageshow事件：）谢谢，当我在Chrome中测试时，这似乎有效，但当我推到apk并在手机上测试时，它不会保存我的姓名。请确保您使用的是最新的Phonegap，正如我所说的，请确保您手机上使用的文件是最新的。我将把这一点补充到我的答案中。

$('#my_name').html(personName);

div id="my_name"