Question

我正在附加我正在执行的项目，但它总是转到错误函数。

为什么要这样做？

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>jQuery UI Autocomplete - Default functionality</title>
    <link rel="stylesheet" href="jquery-ui.css">
    <script src="jquery-1.10.2.js"></script>
    <script src="jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">
    <script>
      $(function() {
          $("#tags").autocomplete({
              source: function (request, response) {
                  $.ajax({
                      url: "test",
                      dataType: "json",
                      success: function(response) {
                          alert("a");
                          console.log(response);
                      },
                      error: function(response) {
                        alert("b");
                          console.log(response);
                      }
                  });
              }
          });
      });
    </script>
  </head>
  <body>
    <div class="ui-widget">
      <label for="tags">Tags: </label>
      <input id="tags">
    </div>
  </body>
</html>

我的JSON文件名为test.json，包含：

[{"SubItemID":1,"MainItemID":1,"SubName":"2%","MainName":"Milk"},
{"SubItemID":2,"MainItemID":1,"SubName":"Skim/Fat Free","MainName":"Milk"},
{"SubItemID":3,"MainItemID":2,"SubName":"Chedder","MainName":"Cheese"}]

Answer 1

网址应为"test.json"，因为您收到的是静态文件。您不会向有效的服务器URL发送请求。

Answer 2

它必须是你试图从url中获取的实际文件：test除非在后端你有一些机制可以给你一个JSON响应，所以测试不会给你任何回复，dataType：JSON

网址中的文件可以是任何内容。 something.json或test.php，test.asp，test.jsp无论如何你需要指定一个具有实际JSON的文件

很好的回答Birgit Martinelle。这将是我的第一直觉。

Answer 3

你可以对后端API进行AJAX调用，它需要返回JSONP格式而不仅仅是JSON，否则你会得到错误。这是由于相同的原产地政策： https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

此讨论可能有助于理解JSONP：

Can anyone explain what JSONP is, in layman terms?

但是，另一种方法是禁用Google Chrome浏览器的安全性，然后它就能正常运行。但这不是解决方案。您需要使用JSONP格式。

所以最好让你的JSon文件像这样，即JSonP格式

myCallback([{"SubItemID":1,"MainItemID":1,"SubName":"2%","MainName":"Milk"},
{"SubItemID":2,"MainItemID":1,"SubName":"Skim/Fat Free","MainName":"Milk"},
{"SubItemID":3,"MainItemID":2,"SubName":"Chedder","MainName":"Cheese"}]);

希望这可以帮助您解决问题

JQuery中的AJAX调用给出了错误

3 个答案: