JQM JSON请求无法在移动设备上解析

Question

I'm developing a mobile app that uses json to retrieve database data. 我正在开发一个使用json检索数据库数据的移动应用程序。 Using my mac browser I can get the requested data and the alert and display it on a new mobile page. 使用我的Mac浏览器，我可以获得所需的数据和警报，并将其显示在新的移动页面上。 I can't get it to work on safari on ipad or iPhone. 我无法在iPad或iPhone上的Safari浏览器上使用它。 The page loads but no data. 页面加载但没有数据。

Any hints would be appreciated. 任何提示将不胜感激。

HTML code HTML代码

<!DOCTYPE HTML>
<html>
<head>
 <title>tourmap_main.jpg</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>   
<script src="js/treedetails14.js"></script><div data-role="page" id="firstpage" data-theme="a">
<div data-role="header" data-position="fixed">
        <h1>Winter Hill Garden Tour</h1>

</div>
<div data-role="content" id="mainpage" data-theme="a">
    <div id="area1Button"><a href="#area1" data-role="button" data-   transition="flip">AREA 1</a>
    </div>
</div>
<div data-role="footer" data-theme="a" data-position="fixed"></div>
</div>
<div data-role="page" id="area1" data-add-back-btn="true" data-theme="a">
<div data-role="header" data-position="fixed">
        <h1>Garden Tour - Area 1</h1>

</div>
<div id="area1content" data-role="content">
    <div id="tree105" class="treebutton"><a href="#detailsPage" data-rel="page" data-role="button" data-transition="slide" data-id="27" class="treelink">Button 1</a>
    </div>
    <div id="tree106" class="treebutton"><a href="#detailsPage" data-rel="page" data-role="button" data-transition="slide" data-id="32" class="treelink">Button 2</a>
    </div>
</div>
</div>
<div data-role="page" id="detailsPage" data-overlay-theme="a">
<div data-role="header" data-add-back-btn="true">
    <h1 align="left"><span>Tree information -</span> <span id="treetitle"></span></h1>
</div>
<div id="treeDetails" data-role="content">
    <div id="treedescription"></div>
</div>
<div data-role="footer" data-theme="a" data-position="fixed"></div>
</div>

And my script: 而我的脚本：

$(document).on('pagebeforeshow', '#firstpage', function(){ 
$('.treelink').live('click', function(){
    var serviceURL = "http://winterhill.com.au/gardentour/services/";
    currentId = $(this).attr('data-id');
    $.getJSON(serviceURL + 'gettree.php?id='+currentId, function(data) {
        var tree = data.item;
        alert(tree.tree_description);
        $('#detailsPage').append("<p>item1="+tree.tree_description +"</p>");
    });
});
});

Here's the basic code setup: http://jsfiddle.net/VgxnQ/1/ 这是基本的代码设置： http : //jsfiddle.net/VgxnQ/1/

Answer 1

Try this code:

$('#area1').on('pagebeforeshow', function () {
    $('.treelink').on('click', function () {

        currentId = $(this).attr("data-id");

        window.sessionStorage.setItem("IdKey", currentId);

        $.mobile.changePage( "#detailsPage", 
                             { reverse: false, 
                               changeHash: false 
                             });    

    });
});

$('#detailsPage').on('pagebeforeshow', function () {

    currentId = window.sessionStorage.getItem("IdKey");

     var serviceURL = "http://winterhill.com.au/gardentour/services/";

    $.getJSON(serviceURL + 'gettree.php?id=' + currentId, function (data) {
            var tree = data.item;     
            $('#treedescription').text(tree.tree_description);
        });

});

Still there is Access allow origin issue that needs to be resolved at the server level either have it JSONP enabled or enable the setting that it allows any domain that access the web service. 仍然存在需要在服务器级别解决的“允许访问源”问题，或者启用了JSONP或启用了允许任何访问Web服务的域的设置。

JQM JSON请求无法在移动设备上解析

问题描述

1 个解决方案

解决方案1
0 2013-07-23 04:24:51

JQM JSON请求无法在移动设备上解析

问题描述

1 个解决方案

解决方案1 0 2013-07-23 04:24:51

解决方案1
0 2013-07-23 04:24:51