Оцените подсказку

xaero · February 13, 2009

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>WIKI</title>
</head>

<style type="text/css">
#suggest {
	width: 300px;
	height: 110px;
	border: 1px solid #eaeaea;
	background: #ffffff;
	position: absolute;
	overflow: auto;
	visibility: hidden;
}
table.tbl	{ width: 100%; }
table.tbl td { font-family: Verdana; font-size: 12px; }
table.tbl td.slc { background: #eaeaea; }
</style>

<script type="text/javascript">
<!--//

var words = new Array('America','AQSH','SERVER','BLOG','TD','SER','INCLUDE','COPPERMINE',
	'Ali','Alifbe','Allergiya','Algebra','Alximya','Internet');

// sort all words by alphabetically
words.sort();

// get position
var position = -1;

function searchWord(val){
	var found = new Array();
	var index = 0;
	if(words.length>0){
		val = escape(val);
		for(var i=0; i<words.length; i++){
			reg = new RegExp('^'+val, 'gi');
			if(words[i].match(reg)){
				found[index++] = [words[i], index-1];
			}
		}
	}
	return found;
}

function displayResult(arr){
	var table = '';
	if(arr.length>0){
		table += '<table border=0 class="tbl">';
		for(var i=0; i<arr.length; i++){
			table += '<tr>';
				table += '<td id="td_'+i+'">'+arr[i][0]+'</td>';
			table += '</tr>';
		}
		table += '</table>';
	}
	return table;
}

function hl_keyUp(e){
	e = (!e) ? window.event : e;
	t = (!e.target)  ? e.srcElement : e.target;
	c = (e.charCode) ? e.charCode   : ((e.keyCode) ? e.keyCode : ((e.which) ? e.which : 0));
	k = document.getElementById('keyword');
	s = document.getElementById('suggest');
	w = document.getElementById('scroll');
	if(k.value!=''){
		result = searchWord(k.value);
		w.innerHTML = displayResult(result);
		s.style.visibility = 'visible';
		if(c==40 || c==38){
			if(c==40){
				if(position<result.length-1){
					position++;
					if(position>5){
						s.scrollTop = position * 18;
					}
				}
			}
			if(c==38){
				if(position>0){
					position--;
					s.scrollTop = position * 18;
				}
			}
			document.getElementById('td_'+position).className = 'slc';
		}

		if(c==13){
			posVal = document.getElementById('td_'+position);
			k.value = posVal.innerHTML;
			s.style.visibility = 'hidden';
			position = -1;
		}
	}else{
		s.style.visibility = 'hidden';
		position = -1;
	}	
}

window.onload = function(){
	var getKeyWord = document.getElementById('keyword');
		getKeyWord.setAttribute('autocomplete', 'off');
		getKeyWord.focus();
}
//-->
</script>

<body>

<table cellspacing="0" cellpadding="0" border="0">
<tr>
	<td><input type="text" id="keyword" onkeyup="hl_keyUp(event)"></td>
</tr>
<tr>
	<td>
		<div id="suggest">
			<div id="scroll"></div>
		</div>
	</td>
</tr>
</table>


</body>
</html>

Vlad · February 16, 2009

Неплохо. Но так и хочется по подсказке щелкнуть, чтобы в поле она появилась.

Sign In

Оцените подсказку

Recommended Posts

xaero

Link to comment

Share on other sites

Vlad

Link to comment

Share on other sites

Обсуждения

Forums

Important Information