JayData / Phonegap 适用于 iPad 模拟器但不适用于 iPad 设备
Posted
技术标签:
【中文标题】JayData / Phonegap 适用于 iPad 模拟器但不适用于 iPad 设备【英文标题】：JayData / Phonegap works in iPad Simulator but not iPad device 【发布时间】：2013-03-19 04:27:42 【问题描述】：我正在使用以下博客作为代码库进行概念验证应用程序。
http://jaydata.org/blog/how-to-check-if-your-websql-environment-is-working
当我使用 XCode 4.6.1 在 iPad 6.1 模拟器中运行以下命令时，我可以看到预期的输出。
[LOG] Received Event: deviceready
[LOG] begin testing
[LOG] define Department Entity
[LOG] define Employee Entity
[LOG] saving Entity done.
但是当我通过 USB 将以下内容运行到实际的 iPad 设备时，它的输出以“定义部门实体”结束。我没有看到任何错误；这是 console.log 输出：
[LOG] Received Event: deviceready
[LOG] begin testing
[LOG] define Department Entity
任何帮助将不胜感激。
<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="css/index.css" />
<title>Hello World</title>
<!--jQuery-->
<script type="text/javascript" src="jquery/jquery-1.7.2.js"></script>
<script type="text/javascript" src="jquery/jquery.mobile-1.1.1.js"></script>
<!--jayData and the different providers used-->
<script type="text/javascript" src="js/JayData-1.2.7.1/JayData.js"></script>
<script type="text/javascript" src="js/JayData-1.2.7.1/jaydataproviders/SqLiteProvider.js"></script>
<!--PhoneGap-->
<script type="text/javascript" src="cordova-2.5.0.js"></script>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
<script type="text/javascript" src="cordova-2.5.0.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
<script type="text/javascript">
var jqmReady = $.Deferred(),
pgReady = $.Deferred();
// mobileinit does not work. pageinit works.
// jqm ready
$(document).bind("pageinit", jqmReady.resolve);
// phonegap ready
document.addEventListener("deviceready", pgReady.resolve, false);
// all ready :)
$.when(jqmReady, pgReady).then(function ()
console.log('begin testing');
console.log('define Department Entity');
$data.Entity.extend("$org.types.Department",
Id: type: "int", key: true, computed: true ,
Name: type: "string", required: true ,
Employees:
type: Array,
elementType: "$org.types.Employee",
inverseProperty: "Department"
);
console.log('define Employee Entity');
$data.Entity.extend("$org.types.Employee",
Id: type: "int", key: true, computed: true ,
Name: type: "string", required: true ,
Department: type: $org.types.Department, inverseProperty: 'Employees'
);
$data.EntityContext.extend("$org.types.OrgContext",
Department: type: $data.EntitySet, elementType: $org.types.Department ,
Employee: type: $data.EntitySet, elementType: $org.types.Employee
);
$org.context = new $org.types.OrgContext(
name: "webSql", databaseName: "OrgDatabase",
dbCreation: $data.storageProviders.DbCreationType.DropTableIfChanged
);
var department = new $org.types.Department( Name: 'Department1' );
var employee = new $org.types.Employee( Name: 'John Smith' );
department.Employees = [employee];
$org.context.onReady(function ()
$org.context.Department.add(department);
$org.context.saveChanges();
);
console.log('saving Entity done.');
);
</script>
</body>
</html>
【问题讨论】：
如果使用phonegap，为什么需要jaydata？ Phonegap 有自己的database。 【参考方案1】：在 jaydata 论坛上回答，但我复制到这里，也许其他人会搜索这个
要点： 1.使用jquery 1.8+，不支持1.7。如果您必须使用 1.7 那么请使用 q promise，如果您有任何问题，请告诉我们 2. 不幸的是，您只能在 onload 事件之后订阅 deviceready 事件......
此代码适用于我们在 ipad 6.1 上
(function main()
var jqmReady = $.Deferred();
var pgReady = $.Deferred();
// mobileinit does not work. pageinit works.
// jqm ready
$(document).bind("pageinit", jqmReady.resolve);
// phonegap ready
$.when($.ready)
.then(function()
document.addEventListener("deviceready", pgReady.resolve, false);
);
var Employee = $data.define('Employee',
Id: type: "int", key: true, computed: true ,
Name: type: "string", required: true ,
Department: type: "Department", inverseProperty: 'Employees'
);
var Department = $data.define('Department',
Id: type: "int", key: true, computed: true ,
Name: type: "string", required: true ,
Employees: type: Array, elementType: "Employee", inverseProperty: 'Department'
);
var OrgDatabase = $data.EntityContext.extend('OrgDatabase',
Departments: type: $data.EntitySet, elementType: Department ,
Employees: type: $data.EntitySet, elementType: Employee
);
var context = new OrgDatabase(name: 'webSql', databaseName: 'OrgDatabase', dbCreation: $data.storageProviders.DbCreationType.DropTableIfChanged);
// all ready :)
$.when(jqmReady, pgReady, context.onReady()).then(function ()
var employee = new Employee( Name: 'John Smith' );
var department = new Department( Name: 'Department1' );
department.Employees = [employee];
context.Departments.add(department);
context.saveChanges(function()
alert('saving Entity done.');
);
);
)()
【讨论】：
【参考方案2】：我使用 Web Inspector 发现 iPad 上的应用无法加载“JayData.js”。
事实证明，实际的 js 文件有一个全小写字符的文件名。因此，解决方法是将“JayData.js”更改为“jaydata.js”，该应用程序可以在 iPad 上运行。
http://developer.apple.com/library/ios/#documentation/AppleApplications/Reference/SafariWebContent/DebuggingSafarioniPhoneContent/DebuggingSafarioniPhoneContent.html
【讨论】：
以上是关于JayData / Phonegap 适用于 iPad 模拟器但不适用于 iPad 设备的主要内容，如果未能解决你的问题，请参考以下文章
适用于 iOS 的 Phonegap/Cordova 日历插件无响应
phonegap pushNotifications 插件是不是适用于 Cordova 构建？
phonegap 相机适用于 iPhone，但不适用于 iPad