jQuery和Grails/HTML - 使文本字段像谷歌一樣完整的文本

我想在我的頁面中顯示某些字段，讓我像Google一樣列出可能的整理語句。jQuery和Grails/HTML - 使文本字段像谷歌一樣完整的文本

我認爲這是通過jQuery完成的，但我不確定。

該文本框被命名爲商品。

比方說，我寫通用和在列表，數組或數據庫我有普通商品我應該告訴我在文本字段下的普通商品。

在此先感謝！

------- ------- UPDATE

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"> 
var data = "General Commodity,General Store,General Custer,General Mills".split(","); 

    $("#Ccommodity").autocomplete({ 
      source: data 
     }); 
</script>

當我去Ccommodity輸入文本框我寫G和什麼也沒發生，也許我有一些語法的錯誤。

感謝您的幫助

來源

2010-10-06 randomizertech

你可能會想看看的jQueryUI Autocomplete widget。它提供了幾種提供建議列表的方法，幾乎肯定會有一些內容可以幫助您。

這裏是一個非常基本的演示：http://jsfiddle.net/QU9st/

下面是該源：

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

該演示只需使用一個靜態字符串數組作爲數據源，但你也可以使用遠程數據源，在格式如JSON或XML。

爲了得到它，只需拖放在您<head>標籤這個地方：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>

當然，你還需要包括jQuery的：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

來源

2010-10-06 17:16:05 Ender

這正是我要找的。我需要爲Grails安裝jquery-ui插件嗎？ – randomizertech 2010-10-06 17:35:01

是的，你需要在你的頁面上特別包含jQueryUI。您可以從他們的網站下載，或者從Google的代碼庫獲取鏈接：http://code.google.com/apis/libraries/devguide.html – Ender 2010-10-06 17:40:52

如何在Grails中安裝jQuery UI？ – randomizertech 2010-10-06 21:32:33

jQuery有一個Autocomplete widget可以得到它做你想做的事。這裏有一個例子： jQuery的：

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

HTML：

<input type="text" id="commodity" name="commodity">

來源

2010-10-06 17:19:13 GSto

我需要爲Grails安裝jQuery-UI插件，還是已經附帶了jQuery插件？ – randomizertech 2010-10-06 17:35:45

這與jQueryUI是分開的，這就是爲什麼我在@Ender中包含不同的答案 – GSto 2010-10-06 17:56:37

出於某種原因拋出一個錯誤：/ – randomizertech 2010-10-06 20:43:42

jQuery和Grails/HTML - 使文本字段像谷歌一樣完整的文本

回答

相關問題