1

我构建了一个列出一些项目的应用程序,通过在 #site1 上启动时使用AJAX * once *从我的服务器请求JSONP 。如果您点击项目(DIV),它会将您定向到#sitedetails。在“sitedetails”上,点击项目的基本细节和描述将使用 AJAX jsonp 加载(它只是文本)。

如果我在带有 WIFI 的测试设备上尝试我的 jQuery-Mobile PhoneGap 应用程序,它可以正常工作,一旦我使用3G,它就会终止连接。有时“sitedetails”需要很长时间才能发出请求(2-5 秒)。通常需要不到 1 秒,因为它只有几 kb。因为我在 JSONP 请求上设置了超时。5sec 它经常显示我的函数的错误消息。

当这些类型的错误发生时,我导航回 site1 并再次点击一个项目,它就会工作。

在 XCode 中,它会在遇到该问题时显示此消息:

purgeIdleCellConnections: found one to purge conn = 0x1f078460
purgeIdleCellConnections: found one to purge conn = 0x1e591fd0
purgeIdleCellConnections: found one to purge conn = 0x1e591fd0

虽然我的3G连接又快又稳定。它也不能是服务器,在WIFI上它会立即响应并在“sitedetails”上显示描述。

现在奇怪的是:我发现只有在我点击一个项目后等待太久才会发生这种情况。我需要导航回“site1”并尽可能快地点击另一个项目,一次又一次,一次又一次......并且不会出现连接问题。但是由于这对用户来说是不现实的,所以它对我没有帮助。

现在源代码:

var itemid;

$(document).on('pageinit', '#site1', function(){
var output = $('#items');
$.ajax({
url: 'http://************.com/api/files/json/mydata.php',
dataType: 'jsonp',
jsonp: 'jsoncallback',
timeout: 5000,
success: function(data, status){
$.each(data, function(i,item){

var allitems =
"<div id='con' data-id="+item.id+">"+
"<div id='name'><b>"+item.name+"</b></div>"+
"<div id='date'><b>"+item.date+"</b></div>"+
"</div>";

output.append(allitems);

});

},
error: function(){
output.text('ERROR - Could not load data.')
}
});
});

点击事件:

$(document).on('tap', '#con', function(event) {
itemid = $(this).attr('data-id');
$.mobile.changePage('#sitedetails');
});

问题区:

$(document).on('pagebeforeshow', '#sitedetails', function(){
var output = $('#itemdetails');
$.ajax({
url: 'http://************.com/api/files/json/mydatadetails.php?itemid='+itemid,
dataType: 'jsonp',
jsonp: 'jsoncallback',
timeout: 4000,
success: function(data, status){
$.each(data, function(i,item){
 var itemdetails =
"<div id='name'><b>"+item.name+"</b></div>"+
"<div id='date'><b>"+item.date+"</b></div>"+
"<div id='date'><b>"+item.details1+"</b></div>"+
"<div id='date'><b>"+item.details2+"</b></div>";

output.empty().append(itemdetails);
});
},
error: function(){
output.text('ERROR - Could not load data.')
} 
});
});

基本上就是这样,除了只有一个 DIV 的 2 个页面(site1:#items,sitedetails:#itemdetails)。

我在 iOS 6.1 上使用 XCode 4.6、PhoneGap 2.9、JQuery 1.9、JQM 1.3.1

编辑:我忘记了服务器上的 mydatadetails.php:

<?php
header('Content-type: application/json');

$server = "*******.com";
$user = "***********";
$pw = "***********";
$db = "***********";

$itemid = $_GET["itemid"];

$connection = mysql_connect($server, $user, $pw) or die ("Could not connect: " . mysql_error());
mysql_select_db($db, $connection);

$sql = "SELECT id, name, date, details1, details2 WHERE id='".$itemid."'";

$result = mysql_query($sql) or die ("Query error: " . mysql_error());

$records = array();

while($row = mysql_fetch_assoc($result)) {
    $records[] = $row;
}

mysql_close($connection);

echo $_GET['jsoncallback'] . '(' . json_encode($records) . ');';
?>

我感谢每一个答案。

4

0 回答 0