1

我希望我能在使用 jquery easy autocomplete 方面获得一些帮助。我正在尝试创建一个 url 函数,该函数调用具有 javascript xmlrpc 函数的 html 页面,并返回 json 格式的名称列表。我在 Web 控制台中得到的只是:警告:无法加载响应数据。

查询页面:

<html>
<script src="./js/jquery-3.1.1.min.js" type="text/javascript" ></script>
<script src="./js/jquery.xmlrpc.js" type="text/javascript" ></script>
<body>

<p id="display"></p>
</body>

<script>
$(document).ready(function() {
    var url = "https://url.to.my.api/nameapi";
    $.xmlrpc({
        url: url,
        methodName: 'API.FullNameQuery',
        success: function(response, status, jqXHR) { 
            var resp = response + '';
            document.getElementById('display').innerHTML = resp;
        },
            error: function(jqXHR, status, error) { console.log("Error getting information:" + error) }
    });
});
</script>
</html>

简易自动完成页面:

<html>
<script src="./js/jquery-3.1.1.min.js" type="text/javascript" ></script>
<script src="./js/jquery.easy-autocomplete.min.js"></script>
<link rel="stylesheet" href="css/easy-autocomplete.min.css"> 
<link rel="stylesheet" href="css/easy-autocomplete.themes.min.css">
<body>

<input id="inputOne" placeholder="Full Name" />
<input id="inputTwo" placeholder="netID" />
</body>

<script>
$(document).ready(function() {
var resp;
var options = {
    url: function(phrase) { 
        return phrase !== "" ? 
"https://url.to.my.api/get-people.html" : 
"https://url.to.my.api/get-people.html";
    },

    getValue: "fullName",
    ajaxSettings: {
        dataType: "json"
    },
    requestDelay: 300,
    theme: "blue-light",
    list: {
        maxNumberOfElements: 200,
        match: {
            enabled: true
        }
    }
};
$("#inputOne").easyAutocomplete(options);
});
</script>
</html>

这是托管在 IIS 服务器上的,我不能像示例显示的那样使用 php 来轻松自动完成。该页面返回正确的 json,因为我已经对其进行了验证,所以我有点困惑它不喜欢什么。

4

2 回答 2

1

如果我理解正确,我会遇到同样的问题。

我只想加载一个数据数组一次,这不是自动完成的工作方式。如果您使用 URL,它会在您键入字母后发出请求。

1):创建一个加载设置的Easy AutoComplete函数(可重复使用是涂料):

function autoComplete(data_src) {
    return {
        data: loadManufacturer(data_src),
        getValue: "name",
        theme: "bootstrap",
        list: {
            match: {
                enabled: true
            },
            showAnimation: {
                type: "fade", //normal|slide|fade
                time: 200,
                callback: function () {}
            },

            hideAnimation: {
                type: "slide", //normal|slide|fade
                time: 200,
                callback: function () {}
            }
        }
    };
}

2) : 将数据存储在 var 中

function loadManufacturer(url) {
    var tmp = null;
    $.ajax({
        'async': false,
        'type': "GET",
        'global': false,
        'dataType': 'json',
        'url': url,
        'success': function (data) {
            tmp = data;
        }
    });
    return tmp;
}

3)在输入中调用您的函数:

$("#search_product_manufacturer").easyAutocomplete(
        autoComplete(
                $("#search_product_manufacturer").attr('data-src')
                )
        );
于 2017-09-28T17:55:39.553 回答
0

您正在使用Duckduckgo搜索easyAutocomplete 。

更改您的代码如下:

var options = {
  .....
  ajaxSettings: {
    data: {
      dataType: "jsonp"
    }
  },
  .....
}

对于其他 Ajax 设置,请阅读 Ajax 设置指南

于 2020-08-07T14:08:08.200 回答