1

#site1 での起動時に、AJAXを使用してサーバーからJSONPを* 1 回*要求することにより、いくつかの項目を一覧表示するアプリを作成します。項目 (DIV) をタップすると、 #sitedetails に移動します。「sitedetails」では、クリックされた項目の基本的な詳細と説明が AJAX jsonp で読み込まれます (テキストのみ)。

私のjQuery-Mobile PhoneGapアプリは、WIFIを備えたテストデバイスで試してみると正常に動作しますが、3Gを使用するとすぐに接続が切断されます. "sitedetails" は、リクエストを行うのに非常に長い時間がかかる場合があります (2 ～ 5 秒)。わずか数 kb であるため、通常は 1 秒未満で完了します。JSONP req にタイムアウトを設定したためです。私の関数のエラーメッセージが表示されることがよくあります。

これらの種類のエラーが発生した場合、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 (site1:#items、sitedetails:#itemdetails) を持つ 2 つのページを除いて、基本的にはこれで終わりです。

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