add:   this.elem.onclick = function() { me.hideDiv(); } 
context: function AutoSuggest( elementID, divID, suggestions, widthPX ){	//The 'me' variable allow you to access the AutoSuggest object	//from the elem's event handlers defined below.	var me = this;	//A reference to the element we're binding the list to.	this.elem = document.getElementById( elementID );	this.suggestions = suggestions;	//Arrow to store a subset of eligible suggestions that match the user's input	this.eligible = new Array();	//The text input by the user.	this.inputText = null;	//A pointer to the index of the highlighted eligible item. -1 means nothing highlighted.	this.highlighted = -1;	//A div to use to create the dropdown.	this.div = document.getElementById( divID );	this.widthPX = widthPX;	//Do you want to remember what keycode means what? Me neither.	var TAB = 13;  //ENTER is 13, TAB is 9;	var ESC = 27;	var KEYUP = 38;	var KEYDN = 40;		var mouseISout = true;	this.elem.onblur = function() { 			if (mouseISout){ me.hideDiv(); }	}						//The browsers' own autocomplete feature can be problematic, since it will 	//be making suggestions from the users' past input.	//Setting this attribute should turn it off.	this.elem.setAttribute("autocomplete","off");	//We need to be able to reference the elem by id. If it doesn't have an id, set one.	if(!this.elem.id)	{		var id = "autosuggest" + idCounter;		idCounter++;		this.elem.id = id;	}	/********************************************************	onkeydown event handler for the input elem.	Tab key = use the highlighted suggestion, if there is one.	Esc key = get rid of the autosuggest dropdown	Up/down arrows = Move the highlight up and down in the suggestions.	********************************************************/	this.elem.onkeydown = function(ev)	{		var key = me.getKeyCode(ev);		switch(key)		{			case TAB:			me.useSuggestion(true);			break;			case ESC:			me.hideDiv();			break;			case KEYUP:			if (me.highlighted > 0)			{				me.highlighted--;			}			me.changeHighlight(key);			break;			case KEYDN:			if (me.highlighted < (me.eligible.length - 1))			{				me.highlighted++;			}			me.changeHighlight(key);			break;		}	};	/********************************************************	onkeyup handler for the elem	If the text is of sufficient length, and has been changed, 	then display a list of eligible suggestions.	********************************************************/	this.elem.onkeyup = function(ev) 	{		var key = me.getKeyCode(ev);		switch(key)		{		//The control keys were already handled by onkeydown, so do nothing.		case TAB:		case ESC:		case KEYUP:		case KEYDN:			return;		default://			if (this.value != me.inputText && this.value.length > 0)			if (this.value.length > 0)			{				me.inputText = this.value;									if (suggestions != null){						me.displayDiv( null ); }					else {						me.ajax();}			}			else			{				me.hideDiv();			}		}	};	this.displayDiv = function( newsuggestions ){//		if (newsuggestions != null){ this.eligible = newsuggestions; }//		else{ 		me.getEligible( newsuggestions ); //}				me.createDiv();		me.positionDiv();		me.showDiv();		}	/********************************************************	Insert the highlighted suggestion into the input box, and 	remove the suggestion dropdown.	********************************************************/	this.useSuggestion = function( useFocus )	{		if (this.highlighted > -1)		{			this.elem.value = this.eligible[this.highlighted];			this.hideDiv();			//It's impossible to cancel the Tab key's default behavior. 			//So this undoes it by moving the focus back to our field right after			//the event completes.			//			if (useFocus == true){				setTimeout("document.getElementById('" + this.elem.id + "').focus()",0);				//}		}	};	/********************************************************	Display the dropdown. Pretty straightforward.	********************************************************/	this.showDiv = function()	{		this.div.style.display = 'block';	};	/********************************************************	Hide the dropdown and clear any highlight.	********************************************************/	this.hideDiv = function()	{		this.div.style.display = 'none';		this.highlighted = -1;	};	/********************************************************	Modify the HTML in the dropdown to move the highlight.	********************************************************/	this.changeHighlight = function()	{		var lis = this.div.getElementsByTagName('LI');		for (i in lis)		{			var li = lis[i];			if (this.highlighted == i)			{				li.className = "selected";			}			else			{				try{li.className = "";} catch(e){}			}		}	};	/********************************************************	Position the dropdown div below the input text field.	********************************************************/	this.positionDiv = function()	{		var el = this.elem;		var x = 0;		var y = el.offsetHeight;			//Walk up the DOM and add up all of the offset positions.		while (el.offsetParent && el.tagName.toUpperCase() != 'BODY')		{			x += el.offsetLeft;			y += el.offsetTop;			el = el.offsetParent;		}		x += el.offsetLeft;		y += el.offsetTop;		this.div.style.left = x + 'px';		this.div.style.top = y + 'px';	};	/********************************************************	Build the HTML for the dropdown div	********************************************************/	this.createDiv = function()	{		var ul = document.createElement('ul');		//Create an array of LI's for the words.		for (i in this.eligible)		{			var word = this.eligible[i];				var li = document.createElement('li');			var a = document.createElement('a');			a.href="javascript:false";			a.innerHTML = word;			li.appendChild(a);				if (me.highlighted == i)			{				li.className = "selected";			}				ul.appendChild(li);		}			this.div.replaceChild(ul,this.div.childNodes[0]);			this.div.onmouseout = function(){						mouseISout = true;		}								/********************************************************		mouseover handler for the dropdown ul		move the highlighted suggestion with the mouse		********************************************************/		ul.onmouseover = function(ev)		{			mouseISout = false;			//Walk up from target until you find the LI.			var target = me.getEventSource(ev);			while (target.parentNode && target.tagName.toUpperCase() != 'LI')			{				target = target.parentNode;			}					var lis = me.div.getElementsByTagName('LI');							for (i in lis)			{				var li = lis[i];				if(li == target)				{					me.highlighted = i;					break;				}			}			me.changeHighlight();		};		/********************************************************		click handler for the dropdown ul		insert the clicked suggestion into the input		********************************************************/		ul.onclick = function(ev)		{			me.useSuggestion(true);			me.hideDiv();			me.cancelEvent(ev);			return false;		};			this.div.className="suggestion_list";		this.div.style.position = 'absolute';	};	/********************************************************	determine which of the suggestions matches the input	********************************************************/	this.getEligible = function( newsuggestions )	{		if (newsuggestions != null) { this.eligible = newsuggestions; return; }				this.eligible = new Array();		for (i in this.suggestions) 		{			var suggestion = this.suggestions[i];						if(suggestion.toLowerCase().indexOf(this.inputText.toLowerCase()) == "0")			{				this.eligible[this.eligible.length]=suggestion;			}		}	};	/********************************************************	Helper function to determine the keycode pressed in a 	browser-independent manner.	********************************************************/	this.getKeyCode = function(ev)	{		if(ev)			//Moz		{			return ev.keyCode;		}		if(window.event)	//IE		{			return window.event.keyCode;		}	};	/********************************************************	Helper function to determine the event source element in a 	browser-independent manner.	********************************************************/	this.getEventSource = function(ev)	{		if(ev)			//Moz		{			return ev.target;		}			if(window.event)	//IE		{			return window.event.srcElement;		}	};	/********************************************************	Helper function to cancel an event in a 	browser-independent manner.	(Returning false helps too).	********************************************************/	this.cancelEvent = function(ev)	{		if(ev)			//Moz		{			ev.preventDefault();			ev.stopPropagation();		}		if(window.event)	//IE		{			window.event.returnValue = false;		}	}}
meta: 10221	/local1/tlutelli/issta_data/temp/all_js/javascript/2006_temp/2006/10221/50be29fa6dfd9b4b7a64188409adafea5b14d369/autocompleter.js/buggy/YDFramework2.0/trunk/YDFramework2/addons/YDAjax/js/autocompleter.js