如何通过jsonp从PHP页面解析id到html-jquery页面


how to parse id from php page to html-jquery page via jsonp

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

我的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) . ');';
////////////////////
?>

这工作得很好,我得到json对象id在php中。您可以检查例如http://www.dr-trkuljic.com/tekst.php?id=1(您可以尝试id 2, 3和4),您将得到结果。

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

我使用这个在我的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页面?

谢谢。

1如果您在同一域名

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语法是否正确。

由于我觉得我之前的答案不正确,请允许我编辑:

从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文件中发送这个头文件,并附上你工作的地方的适当url:

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