Suggest Framework是一款仿Google輸入自動提示的JS框架。(以下內容來自Readme.txt和網絡)
Suggest Framework
Copyright (c) 2005-06 Matthew Ratzloff
Version 0.31
Overview
--------
Suggest Framework allows developers to easily add "suggest" functionality
to their websites and projects, which can vastly improve the user experience
by speeding up phrase-based searching. Any number of search boxes can be
used on a page, each configurable with a variety of options.
Suggest Framework is also compatible with nearly all mainstream browsers,
including Internet Explorer 5+ (Win/Mac), Firefox (Win/Mac), and Opera 8+.
It... sort of works with Safari.
Installation
------------
You only need one copy of SuggestFramework.js on your server in order to
use it throughout. You can customize the look of the suggest dropdowns
with CSS; these styles should be included in your sitewide stylesheet and
adjusted per-page if necessary.
Note: The JavaScript file has been compressed for speed using Dojo ShrinkSafe,
which can be found at <http://alex.dojotoolkit.org/shrinksafe/>.
Usage
-----
Include the following two lines in the head of the page:
<script type="text/javascript" src="/path/to/SuggestFramework.js"></script>
<script type="text/javascript">window.onload = initializeSuggestFramework;</script>
Now you have five additional attributes available for any named text input
field:
action The dynamic page that accepts input by GET and returns a
JavaScript array of relevant data. Required.
capture The column (from 1) that will be captured in the hidden input
field. This is useful for storing ID numbers that you don't
want the user to see. Hidden fields are automatically created
and named the same as the primary field, except that they are
preceded with an underscore. For example, if the main input is
"example", the hidden input will be called "_example". Optional;
default is 1.
columns The number of columns to display in the dropdown. For example,
you might search for employees by name and display their ID
on the right. Optional; default is 1.
delay The search delay, in milliseconds. A lower delay increases
responsiveness but puts more strain on the server. Optional;
default is 1000 (1 second).
heading If set to true, uses first array value as a non-selectable
header. Useful when you have two or more columns. Optional;
default is false.
The page that processes the user input (defined in "action") accepts two
parameters:
type The name of the text input field
q The query phrase, encoded in UTF-8 format
Suggested examples for PHP and ColdFusion have been included, although
any server-side language will work. For more than one column, a multi-
dimensional array is expected. For example,
new Array(new Array("A1", "B1"), new Array("A2", "B2"));
Finally, there are four CSS classes:
.SuggestFramework_List The dropdown container
.SuggestFramework_Heading The optional dropdown headings
.SuggestFramework_Highlighted The highlighted suggestion
.SuggestFramework_Normal Non-highlighted suggestions
-----------------內容很簡單，但是很實用。要注意的是傳值方式用的是get,編碼是utf-8,需要進行編碼轉換纔可以正確顯示中文。在jsp中，可以
String name=request.getParameter("q"); //獲取傳遞過來的參數，爲什麼是q呢？這跟框架裏面的參數有關，可以看js說明就知道了。
name = new String(name.trim().getBytes("ISO8859-1"),"UTF-8");
動態構造Array數組，返回給前臺頁面 (2.jsp)：
<%@ page language="java" import="java.sql.*,com.db.*" pageEncoding="utf-8"%>
<%
//避免頁面被緩存
response.setHeader("Cache-Control","no-store");
response.setHeader("Pragma","no-cache");
response.setDateHeader("Expires",0);
String name=request.getParameter("q"); //獲取傳遞過來的參數，爲什麼是q呢？這跟框架裏面的參數有關，可以看js說明就知道了。
name = new String(name.trim().getBytes("ISO8859-1"),"UTF-8");
Connection conn=null;
PreparedStatement stmt=null;
ResultSet rs=null;
try
{
conn=ProxoolAction.getConnection();
String sqlStr="";
if(name==null||name.equals(""))
sqlStr="select * from zd_sjpp";
else
sqlStr="select * from zd_sjpp where (spp like '"+name+"%' or szjm like '"+name+"%') and rownum<10";
System.out.println(sqlStr);
stmt=conn.prepareStatement(sqlStr);
rs=stmt.executeQuery();
out.print("new Array("); //框架的意思就是要返回 “二維數組”。三維數組也可以。
while(rs.next())
{
out.print("new Array('"+rs.getString("SPP")+"', "+rs.getInt("SID")+"),");
}
out.print("new Array(/"/",'')"); //最後一個array沒有 逗號（前面的都有 逗號）， 所以最好加一個空的，不放入循環內。
out.print(");");
}catch(Exception e)
{
}finally
{
ProxoolAction.closeResultSet(rs);
ProxoolAction.closeStatement(stmt);
ProxoolAction.closeConnection(conn);
}
%>