Javascript 为什么我的代码在本地上表现不同，并且没有加载正确的json响应？_Javascript_Jquery_Ajax_Json

Javascript 为什么我的代码在本地上表现不同，并且没有加载正确的json响应？

javascript jquery ajax json

Javascript 为什么我的代码在本地上表现不同，并且没有加载正确的json响应？,javascript,jquery,ajax,json,Javascript,Jquery,Ajax,Json,我想实现从邮政编码自动填充城市和州我找到了这个链接：这个链接非常有效。现在我想复制这段代码，所以右键单击并选择查看页面源代码，在那里我找到了html和ajax代码我在本地主机上复制了创建index.php的代码。我还复制了必要的文件，如jquery.min.js等现在我的代码和link的代码一样，但是我没有得到相同的输出以下是我复制的代码： <!doctype html> <html> <head> <title>ZIP code aut

我想实现从邮政编码自动填充城市和州

我找到了这个链接：

这个链接非常有效。现在我想复制这段代码，所以右键单击并选择查看页面源代码，在那里我找到了html和ajax代码

我在本地主机上复制了创建index.php的代码。我还复制了必要的文件，如jquery.min.js等

现在我的代码和link的代码一样，但是我没有得到相同的输出

以下是我复制的代码：

<!doctype html>
<html>
<head>
<title>ZIP code autocomplete test</title>
<link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.autocomplete.js" type="text/javascript"></script>
<style type="text/css">

body { font-family: Helvetica, Arial, sans-serif; }

.ac_city { font-size: smaller; float: right; width: 70% }
.ac_zip { font-weight: bold; float: left; width: 25%; }

.ac_city, .ac_zip { margin: 0.1em 0; }

</style>
<script type="text/javascript">

$(document).ready(function() {
    $("#zip, #city").autocomplete("zip_json.pl", {
        minChars: 2,
        selectFirst: true,
        matchSubset: true,
        width: 220,
        scrollHeight: 300,
        max: 1024,
        dataType: 'json',
        extraParams: {
            zip: function () {
                return $("#zip:focus").val();
            },
            city: function () {
                var c = $("#city:focus").val();
                return c && c + '%'
            }
        },
        parse: function (data) {
            var a = [];
            for(var i = 0;i < data.length; i++)
                a.push({ data: data[i],
                         value: data[i].zip,
                         result: data[i].zip
                       });
            return a;
        },
        formatItem: function (item) {
            return "<span class='ac_zip'>" + item.zip + "</span>" +
                              "<span class='ac_city'>" + item.city +
                              ", " + item.state + "</span>";
        },
    });
    $("#zip, #city").result(function (event, item) {
        $("#zip").val(item.zip);
        $("#city").val(item.city);
        $("#state").val(item.state);
    });
});

</script>
</head>
<body>
  <p>Enter a zip code or city and it will start autocompleting with 2
  or more chars. Select an item from the list and it will fill in the
  zip, city and state.</p>
  <form>
    <label> ZIP: <input name="zip" id="zip" type="text" size="5" maxlength="5"></label>
    <label> City: <input name="city" id="city" type="text" size="20"></label>
    <label> State: <input name="state" id="state" type="text" size="2" maxlength="2"></label>
  </form>

</body>
</html>

当我在本地检查上面的代码时，实际上代码工作正常，但它不正确 json响应。当我在zip字段中输入2个数字时，它应该显示相关的zipcode，该代码显示在该网站上，但在我的本地浏览器上，它正在加载所有joson_zip.pl文件的json数据

当我检查firebug工具的净输出时，我发现本地输出和链接输出的json响应存在差异

有人能帮我吗？

在源代码中有

<script>
    $("#zip, #city").autocomplete("zip_json.pl", {
        ...
    }
</script>

zip_json.pl表示服务器上的某些内容：http://methvin.net/js/zip/zip_json.pl. 这不是一个文件，就像您保存的JSON一样，而是一个文件。在这里查看：

你应该在你自己的电脑上运行它，因为你需要

您应该谨慎地查看github上的源代码，您需要的一切都在那里

尝试更改

$("#zip, #city").autocomplete("zip_json.pl", {

到

由于跨域请求，这也可能不起作用

您最好的选择是让服务器处理请求

不，不是这样的。我已经在本地计算机上下载了该.pl文件。它仍然不起作用。@P1nGu1n因为他在上下载了zip_json.pl文件local@P1nGu1n当前位置我尝试了你使用URL的技巧：但它对我无效。我也面临着和Akki一样的问题。这确实是一个真实的问题。请检查我编辑的答案，zip_json.pl是一个脚本，而不是一个文件

$("#zip, #city").autocomplete("http://methvin.net/js/zip/zip_json.pl", {