如何使用jquery自動完成？

我正在創建一個使用JSP的Web項目，並試圖使用jquery自動完成從我的數據庫實現一個簡單的用戶搜索，但是我無法理解它是如何工作的。我對jquery和ajax知之甚少，只是爲了讓你知道。我已經完成了下面的代碼並被卡住了。如何使用jquery自動完成？

<%@page contentType="text/html" pageEncoding="UTF-8" import="ewa.dbConnect,ewa.sendEmail,ewa.pwGen,ewa.hashPw,java.sql.*" %> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" /> 
     <script src="js/jquery.autocomplete.js"></script> 
     <script type="text/javascript" 
      src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <title>JSP Page</title> 
    </head> 
    <body> 
     <input type="text" id="search" name="search"/> 
     <script> 
     $("#search").autocomplete("getdata.jsp"); 
    </script> 
    </body> 
</html>

getdata.jsp

<%@page contentType="text/html" pageEncoding="UTF-8" import="ewa.dbConnect,java.sql.*" %> 
<%! dbConnect db = new dbConnect(); %> 
<% 
String query = request.getParameter("q"); 
db.connect(); 
Statement stmt = db.getConnection().createStatement(); 
ResultSet rs = stmt.executeQuery("SELECT username FROM created_accounts WHERE username LIKE "+query); 
while(rs.next()) 
{ 
    out.println(rs.getString("username")); 
} 
db.disconnect 
%>

如果我沒有錯，我從一個網站讀取參數q是默認的，就在那裏，但我如何顯示數據？我如何將getdata.jsp中的值傳遞給自動完成？

來源

2011-01-09 sutoL

應該有2個文件，可能會有所幫助：http://viralpatel.net/blogs/ 2009/06/tutorial-create-autocomplete-feature-with-java-jsp-jquery.html – Infinity 2011-01-09 14:46:46

嗨，這是我去的網站，但它沒有提供足夠的文檔，並且代碼是兩個代碼，但它沒有得到分開 – sutoL 2011-01-09 15:32:06

您所呼叫的自動完成腳本標籤已被列入jQuery的面前。因此，不要讓jQuery鎖定（因爲jQuery對象尚未定義），jQuery自動完成插件的任何內容都不會加載。

你有

<script src="js/jquery.autocomplete.js"></script> 
<script type="text/javascript" 
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

應該

<script type="text/javascript" 
     src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
    <script src="js/jquery.autocomplete.js"></script>

順序顛倒，和你提到的Firebug的錯誤應該消失;我不確定它會解決所有問題，但在解決問題之前什麼都不會解決。

來源

2011-01-09 16:15:45 Yahel

我沒有看到被包含的jQuery UI（一個提供了自動填充功能）

http://jqueryui.com/demos/autocomplete/

所以你需要包括jquery.ui.autocomplete.js （或者，您在使用插件自動完成？如果是這樣，移動到jQuery UI版本）

也可能是來自getdata.jsp的數據格式不正確，用於自動完成。

你多麼努力調試的JavaScript在瀏覽器如Chrome或Firefox中（與螢火）

來源

2011-01-09 14:50:30 RvdK

我通常給（針對jQuery UI自動完成）一個JSON格式的答案，而我看到你的答案循環給出一個CR分隔列表。

在getdata.jsp替代產品：

jim<cr> 
jack>cr> 
jhon<cr>

試圖返回：

[{label: 'jim', value: 'jim'}, {label: 
'jack', value: 'jack'}, {label: 
'jhon', value: 'jhon'}]

來源

2011-01-09 17:10:40

如何使用jquery自動完成？

回答

相關問題