jquery UI Learning Essay Auto-completion

A. Call the AutoComplete () method $ (' #email '). AutoComplete ({source: [' [email protected] ', ' [email protected] ', ' [Email protected] '],}); two. Modify the AutoComplete () style because the AutoComplete () method is a pop-up window, and then the mouse hovers over the style. By Firebug we want to get the style of the hover-time background, we can find the corresponding CSS directly through the JQUERY.UI.CSS.  // without modifying the CSS in the UI, replace it directly with Style.css . Ui-menu-item a.ui-state-Focus {background:url (. /img/ui_header_bg.png);} Note: Other modification scenarios are similar. 

Three Properties of the AutoComplete () method
There are two forms of the auto-complement method: 1.autocomplete (options), options are the parameters in the form of object key-value pairs, each key-value pair represents an option; 2.autocomplete (' action ', param), action Is the string that operates the dialog method, and Param is an option for options.

$ (' #email '). AutoComplete ({source: [' [email protected] ', ' [email protected] ', ' [email protected] '  false  2 True,}); 

$ (' #email 'left center' right Center '}});

Four Events for the AutoComplete () method
In addition to property settings, the AutoComplete () method provides a number of events. These events can provide a callback function for a variety of different states. The This value in these callback functions equals the Div object of the dialog box content, not the entire dialog box Div.

$ (' #email '). AutoComplete ({source: [' [email protected] ', ' [email protected] ', ' [email protected] '],disabled:false, MinLength:1, Delay:0, Focus:function(E, UI) {Ui.item.value= ' 123 ';},select:function(E, UI) {Ui.item.value= ' 123 ';},change:function(E, UI) {alert (‘‘);},search:function(E, UI) {alert (‘‘);},});

//Turn off auto-completion$ (' #email '). AutoComplete (' Close '));//Disable Auto-completion$ (' #email '). AutoComplete (' Disable '));//Enable auto-completion$ (' #email '). AutoComplete (' Enable '));//Delete auto-complete$ (' #email '). AutoComplete (' Destroy '));//Get auto-complete jquery objects$ (' #email '). AutoComplete (' widget '));//Set auto-complete Search$ (' #email '). AutoComplete (' Search ', ');//gets the value of the Param option for an optionsvarDelay = $ (' #email '). AutoComplete (' option ', ' delay ')); alert (delay);//set the value of the Param option for an options$ (' #email '). Dialog (' option ', ' delay ', 0);

Five Use on () in AutoComplete
In the event of AutoComplete, an event method that is handled using the on () method is provided.

function () {alert (' triggers on open! ');});

jquery UI Learning Essay Auto-completion