日期:2014-05-17  浏览次数:20612 次

js 实现HTML文本框实现下拉提示

???????? 今天在做JS实现HTML文本框下拉提示的功能??, 在网上找到一段代码并对这段代码增加了Cookie功能。代码如下:

 

    

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>登录---文本框输入提示/自动完成功能</title>

<script type="text/javascript">
	function mSift_SeekTp(oObj, nDire) {
		if (oObj.getBoundingClientRect && !document.all) {
			var oDc = document.documentElement;
			switch (nDire) {
			case 0:
				return oObj.getBoundingClientRect().top + oDc.scrollTop;
			case 1:
				return oObj.getBoundingClientRect().right + oDc.scrollLeft;
			case 2:
				return oObj.getBoundingClientRect().bottom + oDc.scrollTop;
			case 3:
				return oObj.getBoundingClientRect().left + oDc.scrollLeft;
			}
		} else {
			if (nDire == 1 || nDire == 3) {
				var nPosition = oObj.offsetLeft;
			} else {
				var nPosition = oObj.offsetTop;
			}
			if (arguments[arguments.length - 1] != 0) {
				if (nDire == 1) {
					nPosition += oObj.offsetWidth;
				} else if (nDire == 2) {
					nPosition += oObj.offsetHeight;
				}
			}
			if (oObj.offsetParent != null) {
				nPosition += mSift_SeekTp(oObj.offsetParent, nDire, 0);
			}
			return nPosition;
		}
	}
	function mSift(cVarName, nMax) {
		this.oo = cVarName;
		this.Max = nMax;
	}
	mSift.prototype = {
		Varsion : 'v2010.10.29 by AngusYoung | mrxcool.com',
		Target : Object,
		TgList : Object,
		Listeners : null,
		SelIndex : 0,
		Data : [],
		ReData : [],
		Create : function(oObj) {
			var _this = this;
			var oUL = document.createElement('ul');
			oUL.style.display = 'none';
			oObj.parentNode.insertBefore(oUL, oObj);
			_this.TgList = oUL;
			oObj.onkeydown = oObj.onclick = function(e) {
				_this.Listen(this, e);
			};
			oObj.onblur = function() {
				setTimeout(function() {
					_this.Clear();
				}, 100);
			};
		},
		Complete : function() {
		},
		Select : function() {
			var _this = this;
			if (_this.ReData.length > 0) {
				_this.Target.value = _this.ReData[_this.SelIndex].replace(
						/\*/g, '*').replace(/\|/g, '|');
				_this.Clear();
			}
			setTimeout(function() {
				_this.Target.focus();
			}, 10);
			_this.Complete();
		},
		Listen : function(oObj) {
			var _this = this;
			_this.Target = oObj;
			var e = arguments[arguments.length - 1];
			var ev = window.event || e;
			switch (ev.keyCode) {
			case 9://TAB 
				return;
			case 13://ENTER 
				_this.Target.blur();
				_this.Select();
				return;
			case 38://UP 
				_this.SelIndex = _this.SelIndex > 0 ? _this.SelIndex - 1
						: _this.ReData.length - 1;
				break;
			case 40://DOWN 
				_this.SelIndex = _this.SelIndex < _this.ReData.length - 1 ? _this.SelIndex + 1
						: 0;
				break;
			default:
				_this.SelIndex = 0;
			}
			if (_this.Listeners) {
				clearInterval(_this.Listeners);
			}
			_this.Listeners = setInterval(function() {
				_this.Get();
			}, 10);
		},
		Get : function() {
			var _this = this;
			if (_this.Target.value == '') {
				_this.Clear();
				return;
			}
			if (_this.Listeners) {
				clearInterval(_this.Listeners);
			}
			;
			_this.ReData = [];
			var cResult = '';
			for ( var i = 0; i < _this.Data.length; i++) {
				if (_this.Data[i].toLowerCase().indexOf(
						_this.Target.value.toLowerCase()) >= 0) {
					_this.ReData.push(_this.Data[i]);
					if (_this.ReData.length == _this.Max) {
						break;
					}
				}
			}
			var cRegPattern = _this.Target.value.replace(/\*/g, '*');
			cRegPattern = cRegPattern.replace(/\|/g, '|');
			cRegPattern = cRegPattern.replace(/\+/g, '\\+');
			cRegPattern = cRegPattern.replace(/\./g, '\\.');
			cRegPattern = cRegPattern.replace(/\?/g, '\\?');
			cRegPattern = cRegPattern.replace(/\^/g, '\\^');
			cRegPattern = cRegPattern.replace(/\$/g, '\\$');
			cRegPattern = cRegPattern.replace(/\(/g, '\\(');
			cRegPattern = cRegPattern.replace(/\)/g, '\\)');