Question

我想从php文件中获取JSON数据并将这些值传递给下拉列表。我通过远程jsonp数据源示例使用了jquery自动完成功能，并且它工作正常现在我想通过单击事件使用下拉而不是自动完成。我尝试使用下面的代码，但它无法正常工作

enter image description here

   <script type="text/javascript">
$("#getAddr").click(function(){
     $.ajax({
                    type: 'POST',
                    url: 'json.php', //your server side script
                    dataType: 'json',
                    data: {
                        postcode: request.term
                    },

                    success: function (data) {

                        //if multiple results are returned
                        if(data.Addresses instanceof Array)

                            response ($.map(data.Addresses, function (item) {
                                return {

                        listItems+= "<option value='" + item + "'>" + item + "</option>";

                               $("#DLState").html(listItems);


                                }
                            }));
                    }




                });



});


</script>

这是json文件

<?php
 $postcode = urlencode($_POST['postcode']);
//$postcode ="E145AA";
 $username = "api-key";
$password = "LG5345gdg34";
$remote_url = 'https://api.getAddress.io/uk/'.$postcode;

// Create a stream
$opts = array(
'http'=>array(
'method'=>"GET",
'header' => "Authorization: Basic " . base64_encode("$username:$password")                 
 )
);

 $context = stream_context_create($opts);

 // Open the file using the HTTP headers set above
 $file = file_get_contents($remote_url, false, $context);

//$file='{"Latitude":-0.020223,"Longitude":51.504859,"Addresses":["Abbey Offices Ltd, 1    
 Canada Square, LONDON","B B V A, 1 Canada Square, LONDON","B P R Interiors Ltd, 1 
 Canada Square, LONDON","Citihub Ltd, 1 Canada Square, LONDON","Coutts & Co, 1 Canada 
  Square, LONDON","Diligence Ltd, 1 Canada Square, LONDON","Doctors of the World UK, 1   
   Canada Square, 

print_r($file);
?>

提前致谢

Answer 1

我真的不知道你要做什么，但有一些评论：

dataType是您期望从服务器返回的内容，而不是您要发送的内容。使用contentType。

尝试返回ajax调用并将其与done（）函数链接在一起，而不是嵌入成功。这使代码更具可读性。

对请求进行字符串化，以便您发送json编码的字符串而不是javascript对象。

尝试这样的事情：

<script type="text/javascript">
var onSuccess = function (data) {
                    //if multiple results are returned
                    if(data.Addresses instanceof Array)
                        response ($.map(data.Addresses, function (item) {
                            return {
                    listItems+= "<option value='" + item + "'>" + item + "</option>";
                           $("#DLState").html(listItems);
                            }
                        }));
                }
var postSomething = function(){
 return $.ajax({
                type: 'POST',
                url: 'http://localhost/json.php', //your server side script
                contentType: "application/json",
                data: JSON.stringify({
                    postcode: request.term
                })
            });
});

$("#getAddr").click(function(){
    postSomething().done(onSuccess);
}


</script>

使用jquery如何通过ajax方法获取json数据

1 个答案: