jQuery和Grails / HTML – 像Google一样使文本字段完整

我想在我的页面中创建某些字段，向我显示像Google一样可能的完成句子列表。

我认为这是通过jQuery完成的，但我不确定。

文本域名为商品。

假设我写了General，并且在列表，数组或DB中我有General Commodity我应该在textfield下显示General Commodity。

提前致谢！

——- ——-更新

 var data = "General Commodity,General Store,General Custer,General Mills".split(","); $("#Ccommodity").autocomplete({ source: data });  

当我转到Ccommodity输入文本字段时，我写了G并没有任何反应，也许我在那里有一些语法错误。

谢谢您的帮助

Answer 1

您可能希望查看jQueryUI自动完成小部件 。 它有几种提供建议列表的方法，几乎​​肯定会有一些适合你的东西。

这是一个非常基本的演示： http ： //jsfiddle.net/QU9st/

这是其来源：

 $(function() { var data = "General Commodity,General Store,General Custer,General Mills".split(","); $("#commodity").autocomplete({ source: data }); }); 

该演示只使用静态字符串数组作为数据源，但您也可以使用JSON或XML等格式的远程数据源。

要获得它，只需将其放在标记中的某处：

当然，您还需要包含jQuery：

Answer 2

jQuery有一个自动完成小部件可以让它做你想做的事情。 这是一个例子：jQuery：

 var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax".split(" "); $("#commodity").autocomplete(data); 

HTML：