1

我有以下html代码：

<!DOCTYPE html> 
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <script src="js/jq.js"></script>
        <script src="js/jqm.js"></script>
        <script src="js/jstore.js"></script>
        <script src="js/progressbar.js"></script>
        <script src="js/sql.js"></script>
        <script src="js/phonegap-1.4.1.js"></script>
        <script src="js/sha512.js"></script>
    </head>
    <body>
        <!-- Start of first page: #one -->
        <div data-role="page">
            <!-- header -->
            <div data-role="header">
                <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr>
                        <td>

                        </td>
                        <td>
                        </td>
                    </tr>
                </table>
            </div>
            <!-- /header -->
            <div data-role="content" data-theme="a">
                <center>
                    <span class="progressBar" id="pb1"></span>
                    <br />
                    Initial Syncronisation in progress!
                </center>
            </div>  
            <!-- footer -->
            <div data-role="footer">

            </div>
            <!-- /footer -->
            <script lang="text/javascript">
                document.addEventListener("deviceready", onDeviceReady, false);
                function onDeviceReady() {
                   $("#pb1").progressBar();
                   $("#pb1").progressBar(5);
                   $.ajax({
                        url: 'https://url/user/'+$.jStorage.get("username","false")+'/modeSet/'+$.jStorage.get("password","false")+'/subSequence/'+hex_md5(new Date().getTime())+'.html',
                        dataType:'jsonp',
                        jsonp:'jsonp_callback',
                        jsonpCallback:'infoData',
                         success: function (data) {
                                alert('success');
                       },
                       error:function (xhr, ajaxOptions, thrownError){
                            alert(xhr.status);
                            alert(thrownError);
                        } 
                   });
                }
            </script>
        </div>
    </body>
</html>

当我调用该页面时，我收到一个错误代码 200 和一个包含以下内容的附加警报框：

Error: infoData was not called!

它在搭载 Android 4.0.4 的真正三星 Galaxy S2 上运行。我有互联网连接，但我不知道哪里出错了。

服务器返回的文档：

infoData({"validJsonDocument":"yes"});

我将 Phonegap 1.4.1 与 jQuery 1.7.1 和 jQuery mobile up2date 一起使用

其他库实际上没有被使用。

4

2 回答 2

1

JSONP 代表 JSON with Padding。填充表示将 JSON 响应发送回客户端时包裹在其周围的函数名称。

当收到结果时，它实际上被视为纯 JavaScript，并按原样处理。因此，将调用包裹在 JSON 周围的函数。

这意味着，为了让 JSONP 正常工作，您的 DOM 中必须存在一个加载的函数，该函数与包装 JSON 响应的函数的名称相匹配。

此外，您已使用“jsonCallback”jQuery AJAX 属性将“infoData”指定为回调函数的名称：

jsonpCallback    String, Function

指定 JSONP 请求的回调函数名称。将使用此值代替 jQuery 自动生成的随机名称。最好让 jQuery 生成一个唯一的名称，因为这样可以更轻松地管理请求并提供回调和错误处理。当您想要启用更好的 GET 请求浏览器缓存时，您可能需要指定回调。从 jQuery 1.5 开始，您还可以为此设置使用函数，在这种情况下，jsonpCallback 的值设置为该函数的返回值。

尝试在页面上定义一个名为“infoData”的函数，该函数采用单个参数，这将使您摆脱此错误。

function infoData(jsonObj) {
    alert(JSON.stringify(jsonObj));  // print the raw JSON object
    alert(jsonObj.validJsonDocument); // access the property in your JSON object.
}

或者，您可以接受 jQuery 文档的建议并完全删除 jsonpCallback 选项，并依赖您已经定义的成功回调。

于 2012-04-09T00:51:04.173 回答
0

我将代码修改为以下内容：

<script lang="text/javascript">
            document.addEventListener("deviceready", onDeviceReady, false);
            function onDeviceReady() {
               $("#pb1").progressBar(5);
               $.ajax({           
                    url: 'http:url/jsonp.html', 
                    dataType: 'jsonp',
                    jsonp: 'callback',
                    jsonpCallback: 'jsonpCallback',
                    success: function (data) {
                            $("#pb1").progressBar(25);
                            alert(data.version);
                    },
                    error:function (xhr, ajaxOptions, thrownError){
                        alert(xhr.status);
                        alert(thrownError);
                    }                       
                }); 

            }
            function jsonpCallback(data){
                alert(data.message);
            }
        </script>

如果我在谷歌浏览器中打开页面，它可以正常工作。如果我在 android 浏览器中打开它，它会做同样的事情。给我一个错误 200 并说我没有调用 jsonpCallback。我真的不知道为什么剧本让我这么难过。克里斯

于 2012-04-09T10:49:47.237 回答