javascript 搜索建议 html 输入

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7926042/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 01:44:45  来源:igfitidea点击:

Search suggestion html input

javascripthtmljsonsearch

提问by Harald

I actually working on a website-project. Behind my website, I′ve got a database with recipes.

我实际上在做一个网站项目。在我的网站后面,我有一个包含食谱的数据库。

Now to my problem: on the top of my page, I′ve got a textarea, with which it should be possible to search recipes in the database. My database gives back the following JSON-Object:

现在我的问题是:在我的页面顶部,我有一个文本区域,应该可以在数据库中搜索食谱。我的数据库返回以下 JSON 对象:

{"Data":{"Recipes":{"Recipe_7":{"ID":"7","TITLE":"Wurstel"},"Recipe_43":{"ID":"43","TITLE":"Wurstel2"}}},"Message":null,"Code":200}

I′ve already parsed it that I only have the title:

我已经解析了它,我只有标题:

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {
       var obj = jQuery.parseJSON(xmlhttp.responseText);
    var str="";
    $.each(obj.Data.Recipes, function(){
    str += this.ID + "<br/>";
    str += this.TITLE + "<br/><br/>";
        });
    document.getElementById("txtHint").innerHTML = str;
    document.getElementById("txtHint").style.border="1px solid #A5ACB2";
    }

What I don′t know now is, how to write the str string into a dropdown beneath the search-textarea. What type of element is this?

我现在不知道的是,如何将 str 字符串写入搜索文本区域下方的下拉列表中。这是什么类型的元素?

回答by Graeme Leighfield

Here is a great example! On W3 Schoolsso there is all the code you would need to get this to work for your project!

这是一个很好的例子!在W3 Schools 上,这里有您需要的所有代码,可以让它为您的项目工作!

I hope this helps you out :)

我希望这可以帮助你 :)

回答by sfg2k

try using https://github.com/httpcart/SuggestionsAndSearchJsEverything works out in one line

尝试使用https://github.com/httpcart/SuggestionsAndSearchJs一切都在一行中解决