JQM在桌面瀏覽器上工作而不是在移動設備上

Question

以下代碼可在各種桌面瀏覽器上正常運行，但是其目標目標是智能手機。 從iPhone訪問時- <ul>下的內容為空？

json是從php頁面提取的，並且按預期工作。

編輯：將getJSON更改為靜態json var info以進行測試-仍未在手機上呈現？ -也嘗試過各種版本的JQuery和JQuery-Mobile仍然沒有變化。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no">
<link href="http://jqmdesigner.appspot.com/gk/lib/jquery.mobile/1.4.2/flatui/jquery.mobile.flatui.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<title>parse JSON</title>

<script>        

var info = [
{
"UID":5665,
"StudentID":"BA1400",
"LastName":"BARNES",
"FirstName":"JOHN",
"Affiliation":"DFRS"},
{"UID":10430,
"StudentID":"BA3700",
"LastName":"Barnyard",
"FirstName":"Ashley",
"Affiliation":"OTHER"},
{"UID":5781,
"StudentID":"BJ9188",
"LastName":"BARCLAY",
"FirstName":"GEOFFREY",
"Affiliation":"DFRS"},
{"UID":14815,
"StudentID":"BT0021",
"LastName":"Barhydt",
"FirstName":"Jimmy",
"Affiliation":"TAKOMA PARK"
}
];


$(document).on("pageinit", "#info-page", function () {

var server_url = "http://myDomain/tt_json.php"; 

$.getJSON(server_url, function(notUsing){
    var li = "";
    $.each(info, function (i, name) {
        li += '<li><a href="#" id="' + i + '" class="info-go">' + name.LastName + ',  ' + name.FirstName + '</a></li>';
    });
    $("#prof-list").append(li).promise().done(function () {
        $(this).on("click", ".info-go", function (e) {
            e.preventDefault();
            $("#details-page").data("info", info[this.id]);
            $.mobile.changePage("#details-page");
        });

        $(this).listview("refresh");
    });
});
}); 

$(document).on("pagebeforeshow", "#details-page", function () {
    var info = $(this).data("info");
    var info_view = "";t
    for (var key in info) {

        info_view += '<div class="ui-grid-a"><div class="ui-block-a"><div class="ui-bar field" style="font-weight : bold; text-align: left;">' + key + '</div></div><div class="ui-block-b"><div class="ui-bar value" style="width : 75%">' + info[key] + '</div></div></div>';
    }
    $(this).find("[data-role=content]").html(info_view);
});

</script>
</head>

<body>          

<!--first page -->
<div data-role="page" id="info-page">
<div data-role="header" data-theme="b">
     <h1>GET JSON data</h1>
</div>
<div data-role="content">
    <ul data-role="listview" id="prof-list" data-divider-theme="a" data-inset="true">
        <li data-role="list-divider" data-theme="b" role="heading">Names</li>
    </ul>
</div>
</div>
<!--second page -->
<div data-role="page" id="details-page">
<div data-role="header" data-theme="b"><a href="#" data-rel="back" data-role="button">Go back</a>
     <h1>User Details</h1>
</div>
<div data-role="content"></div>
</div>          

</body>
</html>

Answer 1

不知道為什么這可以解決問題，因為我正在從同一域執行標准json請求，但確實解決了問題：

添加標題： header("Access-Control-Allow-Origin: *");

JQM在桌面瀏覽器上工作而不是在移動設備上

問題描述

1 個解決方案

解決方案1
0 已采納 2014-08-25 19:43:39

JQM在桌面瀏覽器上工作而不是在移動設備上

問題描述

1 個解決方案

解決方案1 0 已采納 2014-08-25 19:43:39

解決方案1
0 已采納 2014-08-25 19:43:39