更改HTML DataList控件自动完成行为 [英] Changing HTML datalist autocomplete behavior

问题描述

我想实现的一个网站我工作的一个搜索自动完成功能。我使用的HTML DataList控件，从后端MySQL数据库动态生成的选项（与AJAX通信）。然而，DataList控件自动完成工作不喜欢，我希望它。自动完成似乎自动忽略的结果，如果关键字不按顺序。

I'm trying to implement a search autocomplete feature for a website I am working on. I am using HTML datalist, with the options generated dynamically from a backend MySQL database (communicating with AJAX). However, the datalist autocomplete isn't working like I want it to. The autocomplete seems to automatically ignore results if the keywords are not in order.

例如，如果我想搜索字符串苹果香蕉橘子，并在搜索框中输入苹果橙类型的，该字符串不会显示出来，即使它是由生成的选项之一我后端。

For example, if I wanted to search for the string "apple banana orange", and typed in "apple orange" in the search box, the string would not show up, even though it is one of the options generated by my backend.

我假定这是某种内在的DataList控件的功能。我想知道如果有解决这个办法，或者如果任何人对如何实施搜索自动完成功能，将解决这个问题有些另类的想法？

I'm assuming that this is some kind of inherent datalist functionality. I was wondering if there was any way around this, or if anyone had some alternative ideas on how to implement a search autocompletion feature that will overcome this problem?

感谢您的帮助。

推荐答案

你有没有考虑 jQuery的自动完成？并且仍然使用Ajax动态生成的值。

Have you considered jQuery autocomplete? and still using Ajax to dynamically generate the values.

<form id="searchbox">
<input id="search" type="text" placeholder="Type here" class='search_input' >
</form>

$(document).ready(function() {
$("input#search").autocomplete({
source: ["apple","banana", "orange"]
});
});

的jsfiddle

这篇关于更改HTML DataList控件自动完成行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！