jQuery文本框自动完成

Question

jQuery文本框自动完成

jqueryautocompletetextfield

3

大家好，我遇到了以下问题。

我制作了一个自动完成功能，当用户输入 无效城市 时，我想在文本框下方显示 "未找到匹配项" 或 "未找到城市" 等字样。

这是我的 jQuery 代码。

（附注） 我需要让它在没有任何自动完成插件的情况下工作。

$('.form-control').keyup(function(e){
    e.preventDefault();
    $.ajax({
        method: "GET",
        url: "https://api.teleport.org/api/cities?search=" + $('.form-control').val(),

}) .done(function(data){
        if(typeof data._embedded["city:search-results"][0] === 'undefined') {
            $('#datalist').append('Please select a valid value.');
        } else {
    console.log(data._embedded["city:search-results"][0].matching_full_name);
    $('option:eq(0)').remove();
    $('#datalist').append('<option value="' + data._embedded["city:search-results"][0].matching_full_name + '">');
}

});
});

- Stiliyan

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Danny Pearson · Accepted Answer

您想实现的是这个吗？

$('.form-control').keyup (function (e) {
    e.preventDefault ();
    $.ajax ( {
        method: "GET",
        url: "https://api.teleport.org/api/cities?search=" + $('.form-control').val (),

    } )
    .done ( function(data){

        if(typeof data._embedded["city:search-results"][0] === 'undefined') {
            $('#datalist').html ('');
            $('#datalist').html ('No Match Found');
        }
        else {
            console.log (data._embedded["city:search-results"][0].matching_full_name);
            $('#datalist').html ('');
            $('option:eq(0)').remove ();
            $('#datalist').html ('<option value="' + data._embedded["city:search-results"][0].matching_full_name + '">' + data._embedded["city:search-results"][0].matching_full_name + '</option>');
        }

    });
});