Shulou(Shulou.com)06/03 Report--

This article is to share with you what SuggestFramework is like. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

one。 First, let's take a look at what suggest framework is.

The original name of Suggest Framework is to imitate a small framework of Google Suggest, so that your text box also has a prompt function. With suggest framework, you can easily achieve the "input prompt" effect on your website, which will greatly improve the user experience and search efficiency.

Multiple search boxes can appear on a page, each of which can be configured separately.

This framework has no browser restrictions and is basically compatible with most current browsers, including Internet Explorer 5 + (Win/Mac), Firefox (Win/Mac), Opera 8 +, and so on.

two。 Here's how to install it.

You just need to copy SuggestFramework.js to your server, and then customize the css style of the prompt effect to achieve personalized search prompts.

As for the css style file, you need to do it yourself and add it to every page.

Add: SuggestFramework.js has tried Dojo ShrinkSafe for compression. For more information, please see http://alex.dojotoolkit.org/shrinksafe/.

three。 Then introduce how to use the

In the tag of the web page, add the following two sentences:

_ window.onload = initializeSuggestFramework

With the above two sentences, each named text box has five more attributes:

1.action must. Accepts the data submitted in GET and returns the dynamic page of the relevant Javascript array.

If 2.capture returns more than one column of results (such as the word and Chinese meaning in this example), the column entered by the user will be replaced (starting at 1). Usually this corresponds to the database field.

Optional, default is 1.

The number of columns displayed in the 3.columns drop-down, such as in this case, the words are queried alphabetically and the Chinese meaning is displayed on the right. Optional, default is 1.

4.delay query latency in milliseconds. Lower latency results in a faster response, but increases the burden on the server. Optional, default is 1000 (1 second).

If 5.heading is set to true, the first array value is used as a non-selectable item (title block). It is useful when you have two or more columns of data. Optional, default is false.

Data submission requires only two pieces of data

Name of the 1.type input box

2.Q search keywords (default UTF-8 encoding)

The compressed package you downloaded already contains examples of php and ColdFusion, but of course this framework can be applied to all programming languages without platform restrictions. The background data output is a Javascript statement. The one-dimensional array reads as follows:

New Array ("val1", "val2", "val3")

The two-dimensional array reads as follows:

New Array (

New Array ("row 1, column 1", "row 1, column 2")

New Array ("line 2, column 1", "line 1, column 2")

New Array ("line 3, column 1", "line 1, column 2")

);

Finally, there are four classes that need to be defined in css

.SuggestFramework _ List prompt content area

.SuggestFramework _ Heading the first prompt

.SuggestFramework _ Highlighted set a highlight prompt

.SuggestFramework _ Normal other hints

four。 Tip, if there is garbled or javascript script errors, please use the following methods to solve.

1. Add a GB2312 to UTF-8 function to the page that returns the data in the background (for example, display.asp), and use this function to convert the content read out by the database into UTF-8 encoding.

two。 If the background is an asp page, add an instruction on the first line of the code.

3. Save the page (such as display.asp) file that returns data from the background into UTF-8 format.

Thank you for reading! This is the end of the article on "how about SuggestFramework". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.