如何通过jsonp将id从php页面解析为html-jquery页面

时间:2014-07-02 15:13:42

标签: php jsonp

我有问题通过id从我的服务器获取jsonp。 我确信我的php很好,但我不知道如何解析从php服务器到htlm-jquery的id。

我的php页面是:

<?php

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

include 'config.php';

$con = mysql_connect($dbhost, $dbuser, $dbpass) or die ("Could not connect: " . mysql_error());
mysql_select_db($dbname, $con);

$id=$_GET['id'];

$sql = "select * from ios where id=$id";
$result = mysql_query($sql) or die ("Query error: " . mysql_error());

$records = array();

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

}

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

////////////////////
?>

这很好用,我在php中通过id得到了json对象。 您可以查看示例http://www.dr-trkuljic.com/tekst.php?id=1(您可以尝试使用ID 2,3和4),您将获得结果。

但我不知道如何在我的html页面中解析jquery

我在我的html页面中使用它:

 $(document).ready(function(){
    var output = $('.nesa');
    $.ajax({
        url: 'http://www.dr-trkuljic.com/tekst.php',
        dataType: 'jsonp',
        data: 'id',
        jsonp: 'jsoncallback',
        timeout: 5000,
        success: function(data, status){
            $.each(data, function(i,item){ 

                //var ispisi = '<li>' + item.naziv + '</li>' ;

                var ispisi = item.naziv + item.tekst;


                output.append(ispisi);
            });
        },
        error: function(){
            output.text('There was an error loading the data.');
        }
    });
});

所以,我的问题是如何在我的html页面中通过id解析(显示)? 准确地说,我的服务器http://www.dr-trkuljic.com/tekst.php?id=1的结果是如何进入我的HTML页面的?

谢谢。

2 个答案:

答案 0 :(得分:1)

1如果您在同一个域

在php更改

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

echo json_encode($records);

JS成功:

success: function(data, status){

    var jsonData = JSON.parse(data);
    var total = jsonData.length;

    for(var i = 0; i < total; ++i){
        var ispis = jsonData[i].naziv + " " + jsonData[i]item.tekst;
        console.log("My ispis ", ispis);
    }
}

2如果你想使用JSONP。 (从另一个域或phonegapp获得响应)

当您需要来自其他域的响应时,您无法使用AJAX请求,您可以做的是在文档中加载新脚本,例如在标记中,您将该脚本作为js脚本加载到您的响应中。在那个js脚本里面你把你的响应放在一个变量中,你也可以调用一些在已加载的js文件中定义的函数。例如

echo "var myVar = " . json_encode($records) . '; myCallbackFunc();';

将该文件作为js文件加载到您的文档中 在某个地方或者你希望获得响应的地方 - myVar将包含你可以使用的响应,当响应加载你的回调函数时会被调用

var head= document.getElementsByTagName('head')[0];
var script= document.createElement('script');
script.type= 'text/javascript';
script.src= 'http://www.dr-trkuljic.com/tekst.php?id=1';
head.appendChild(script);

function myCallbackFunc(){
    // Do something with myVar

    var total = myVar.length;

    for(var i = 0; i < total; ++i){
        var ispis = myVar[i].naziv + " " + myVar[i]item.tekst;
        console.log("My ispis ", ispis);
    }
}

修改

只需仔细检查服务器响应 - javascript语法是否正常。

答案 1 :(得分:0)

由于我觉得我之前的回答不正确,请允许我修改:

从json数组中删除'('和')'之后,您可以简单地使用这种快速简便的简写格式进行jQuery http调用:(因为Content-Type标题已经执行了所有解析) 。然后,您可以自由访问该对象的相应属性。

有关如何使用jQuery的$ .get()和$ .post()等的更多示例...请访问此链接: http://api.jquery.com/category/ajax/shorthand-methods/

$(document).ready(function(){
    var output = $('.nesa');
    var idNumber = 1;

    $.get('http://www.dr-trkuljic.com/tekst.php', {id: idNumber}, function(data, status){
        $.each(data, function(i,item){ 

            //var ispisi = '<li>' + item.naziv + '</li>' ;

            var ispisi = item.naziv + item.tekst;

            output.append(ispisi);
        });
    }).fail(function(){
       output.text('There was an error loading the data.');
    });
});

要克服跨域错误,您可以使用您所在位置的相应网址在您的php文件中发送此标头:

header("Access-Control-Allow-Origin: http://your-domain-or-localhost");