更改HTML datalist自动完成行为

时间:2013-03-04 20:42:50

标签: html5 autocomplete html-datalist

我正在尝试为我正在处理的网站实施搜索自动填充功能。我正在使用HTML datalist,其中包含从后端MySQL数据库动态生成的选项(与AJAX通信)。但是,datalist自动完成功能并不像我想要的那样工作。如果关键字不符合规定,自动填充似乎会自动忽略结果。

例如,如果我想搜索字符串“apple banana orange”,并在搜索框中键入“apple orange”,则字符串不会显示,即使它是我生成的选项之一后端。

我假设这是某种固有的数据主义功能。我想知道是否有任何解决方法,或者是否有人对如何实现可以解决此问题的搜索自动完成功能有一些其他想法?

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

您考虑过jQuery autocomplete了吗?并且仍然使用Ajax动态生成值。

<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