Jquery automatic pop-up Layer Effect code (1/2)

<Script type = "text/Webpage effects" src = "webpage effects/jquery. autocomplete. js"> </script>

<Link rel = "stylesheet" type = "text/css tutorial" href = "js/jquery/jquery.autocomplete.css"/>

<Script type = "text/javascript">

$ (). Ready (function (){

$ ("# Level1name"). autocomplete ("levelautocompleteajaxaction. do ");

$ ("# Level2name"). autocomplete ("levelautocompleteajaxaction. do ");

$ ("# Level3name"). autocomplete ("levelautocompleteajaxaction. do ");

});

</Script>

<Input type = "text" id = "level1name"/>

<Input type = "text" id = "level2name"/>

<Input type = "text" id = "level3name"/>

$ ("# Level1name") is the id in <input type = "text" id = "level1name"/>,

Autocomplete ("levelautocompleteajaxaction. do") is the url to send and the ajax request address

A few lines of code, that's easy!

Note: to support Chinese Input, You need to modify the jquery. autocomplete. js file in a few places. Add the following code in more than 190 lines of the file:

. Bind ("input", function (){

// @ Hack by liqt: support for inputing chinese characters in firefox

Onchange (0, true );
})

Method 2: Automatic pop-up layer

// Display listbox
Function showlstbox ()
{
Var txtbox = Invalid Response Doc ument. getelementbyid ("textbox1 ");
Var lstbox = Invalid Response Doc ument. getelementbyid ("listbox1 ");
Var strinput = txtbox. value;
Var arrmatch = new array (); // string array to be matched
Var strmatch; // string that matches successfully
Arrmatch = ["1111", "aaa", "klkk1", "akl1", "2222a", "ccc", "Nanchang", "Nanchang hi-tech Zone"];
Removeall ("listbox1 ")
For (var I = 0; I <arrmatch. length; I ++)
{
Strmatch = arrmatch [I];
If (strmatch. indexof (strinput)> = 0)
{

Var opt = document. createelement ("option ");
Opt. text = arrmatch [I]. tostring ();
Opt. value = arrmatch [I];
Lstbox. add (opt );
}
}
If (lstbox. haschildnodes ())
{
Lstbox. style. display = "block"; // display
}
Else
{
Lstbox. style. display = "none"; // hide
}
}

// Remove all content from the list with the id as listid
Function removeall (listid)
{
Var lst = your own Doc ument. getelementbyid (listid );
Var length = lst. options. length;
For (var I = length; I> 0; I --)
{
Lst. options [I-1]. parentnode. removechild (lst. options [I-1]);
}
}

// Copy the selected items in The listbox to the text box
Function moveselect (){
Var txtbox = Invalid Response Doc ument. getelementbyid ("textbox1 ");
Var lstbox = Invalid Response Doc ument. getelementbyid ("listbox1 ");
Var length = lstbox. options. length;
For (var I = 0; I <length; I ++)
{
Var lstindex = lstbox. selectedindex;
If (lstindex <0)
Return;
Txtbox. value = lstbox. options [lstindex]. text;
}
// Hide listbox after copying
Lstbox. style. display = "none ";
}

1 2