javascript 使用 jQuery Mobile 和 Phonegap 加载 JSON？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7890980/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Loading JSON using jQuery Mobile & Phonegap?
提问by Danny
Basically I have a php script located on a sever that generates a JSON file listing places from a mysql database. Using jQuery Mobile I am developing an application to display these places. My code works in Chrome & Safari, however when I port it over to Phonegap it doesn't work. I have searched all over the internet but can't find an answer :(.
基本上我有一个位于服务器上的 php 脚本，它生成一个 JSON 文件，列出来自 mysql 数据库的位置。使用 jQuery Mobile 我正在开发一个应用程序来显示这些地方。我的代码在 Chrome 和 Safari 中工作，但是当我将它移植到 Phonegap 时它不起作用。我已经在互联网上搜索了所有内容，但找不到答案:(。
The php file for generating JSON (json.php):
生成JSON的php文件（json.php）：
<?php
header('Content-type: application/json');
$server = "localhost";
$username = "xxx";
$password = "xxx";
$database = "xxx";
$con = mysql_connect($server, $username, $password) or die ("Could not connect: " . mysql_error());
mysql_select_db($database, $con);
$sql = "SELECT * FROM places ORDER BY name ASC";
$result = mysql_query($sql) or die ("Query error: " . mysql_error());
$records = array();
while($row = mysql_fetch_assoc($result)) {
$records[] = $row;
}
mysql_close($con);
echo $_GET['jsoncallback'] . '(' . json_encode($records) . ');';
?>
My Javascript file located within my app (Loads JSON and displays it):
我的 Javascript 文件位于我的应用程序中（加载 JSON 并显示它）：
$('#places').bind('pageinit', function(event) {
getPlaces();
});
function getPlaces() {
var output = $('#placeList');
$.ajax({
url: 'http://www.mysite.com/json.php',
dataType: 'jsonp',
jsonp: 'jsoncallback',
timeout: 5000,
success: function(data, status){
$.each(data, function(i,item){
var place = '<li><a href="">'+item.name+'<span class="ui-li-count">'
+ item.checkins+'</span></a></li>';
output.append(place);
});
$('#placeList').listview('refresh');
},
error: function(){
output.text('There was an error loading the data.');
}
});
}
The HTML looks like this:
HTML 如下所示：
<div data-role="content">
<h3>Places</h3>
<ul data-role="listview" id="placeList" data-inset="true">
</ul>
</div><!-- /content -->
This code works in Chrome & Safari, however when run in the xCode simulator with Phonegap it doesn't load the JSON.
此代码适用于 Chrome 和 Safari，但是当在带有 Phonegap 的 xCode 模拟器中运行时，它不会加载 JSON。
Any help would be much appreciated :)
任何帮助将非常感激 ：）
回答by Per Quested Aronsson
I don't think the problem has anything to do with the server code (PHP), unless you are producing invalid JSON. The question should be tagged with JavaScript rather than PHP. Anyway, there is an excellent article describing a very similar type of application. It even includes sample code. Have a look:
我认为问题与服务器代码 (PHP) 没有任何关系，除非您生成无效的 JSON。这个问题应该用 JavaScript 而不是 PHP 标记。无论如何，有一篇出色的文章描述了一种非常相似的应用程序。它甚至包括示例代码。看一看：
回答by Ziggy Gushi
Dude, That's server side script it won't run unless its hosted on a server with those languages implemented. I'm running into a similar problemn One suggestion was to implmented the AJAX to fetch the data from a php site an return the data. I'm look'n to just forward the whole page over too a Safari webview window (which you have to set in phonegap permissions). Problem there is I get all the Safari chrome on the top and bottom trying to figure out how to trim that so I don't have to recode with AJAX to pull PHP data server side.
伙计，这是服务器端脚本，除非它托管在实现了这些语言的服务器上，否则它不会运行。我遇到了类似的问题 一个建议是实现 AJAX 以从 php 站点获取数据并返回数据。我希望将整个页面也转发到 Safari webview 窗口（您必须在 phonegap 权限中设置）。问题是我在顶部和底部获取了所有 Safari chrome，试图弄清楚如何修剪它，这样我就不必用 AJAX 重新编码来拉 PHP 数据服务器端。
