Suggest Framework是一款仿Google输入自动提示的JS框架

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);
  }
%>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值