JSONP，jQuery和PHP使跨域AJAX調用

Question

1. http://serverA.com/list.php：

HTML：

<form id="myform"> 
    <input id="inputfield" name="view"> 
</form> 

JS：

var inputdata = $('#inputfield').val('ocean-view'); 

$('#myform').submit(function(e) { 
    e.preventDefault(); 

    $.ajax({ 
     type: 'GET', 
     url: 'http://serverB.com/detail.php', 
     data: inputdata, 
     dataType: 'jsonp' 
    }); 
}); 

http://serverB.com/detail.php

PHP：

<?php 
    $view = $_GET['callback'].'('.json_encode(name) .')'; 
?> 

HTML：

<h4><?php echo $view; ?></h4> 

什麼代碼所做的是：

從serverA的，分配一個值 「海景」，以輸入字段，提交本形式到serverB，並將這個值顯示在h4標籤中。

我無法弄清楚如何編寫服務器端代碼來輸出值，即使我已經找到以下帖子。

this和this。

任何形式的幫助表示讚賞。

UPDATE： 我用YQL幫忙看看JSONP回調的響應，這裏是JSON結構：

callback({ 
    "query": { 
    "count": 1, 
    "created": "2013-07-29T13:01:12Z", 
    "lang": "en-US", 
    "results": { 
     "h3": { 
     "class": "mytitle", 
     "content": "Example" 
     } 
    } 
    } 
}); 

Answer 1

其實你很接近成功......只是閱讀這些點。

• 無論何時您發出ajax請求，瀏覽器都會在尊重參數和詳細信息的情況下發送對ajax URL的匹配。在受尊重的URL上執行PHP代碼。它可以以某種格式返回數據。它不能直接在PHP變量中返回數據。

格式：

text/html 
json 
xml 
...... 

主要用於跨域請求，我們使用JSONP。 這意味着PHP腳本將以JSON的形式返回數據。 所以，你只會附和你json_encode直接腳本。這將是你的ajax請求的迴應。

• 現在，當您在ajax函數中獲得數據時，jQuery使用success：function（response）{}您的響應將會到達。 所以變量響應將包含JSON。 您可以使用jQuery選擇器訪問JSON並將數據放入任何標籤中。 $（）。html（response。）;

這些東西可以在調試控制檯的任何瀏覽器中進行分析。那要求什麼和返回什麼。 即使您可以在Mozilla中使用Firebug來檢查Ajax請求。

所以你會做三個改變。

在Ajax中功能寫成功函數：

var inputdata = $('#inputfield').val('ocean-view'); 

$('#myform').submit(function(e) { 
e.preventDefault(); 

$.ajax({ 
    type: 'GET', 
    url: 'http://serverB.com/detail.php', 
    data: "inputdata="+inputdata, 
    dataType: 'jsonp', 
success:function(response){ 
// response will be json type so access it 
// print ur json in html tag like resposne is {"data":23} 
$(<jquery selector>).html(reponse.data); 
} 
}); 

}）;

<?php 
// echo this 
$inputdata = $_GET['inputdata']; 
// perform you logic , 

// make an array to encode it in json 
echo $_GET['callback'].'('.json_encode($responseArr) .')'; 
?> 

並從h4標籤中刪除PHP代碼。