提示补全功能

最新推荐文章于 2025-02-11 15:24:31 发布

nanyswing

最新推荐文章于 2025-02-11 15:24:31 发布

阅读量113

点赞数

分类专栏： css + jquery 文章标签： jQuery CSS HTML ViewUI

css + jquery 专栏收录该内容

12 篇文章

订阅专栏

function checktag(){
	if($("tags").value.lenght!=0){
		if($("tags").value.match(/[^a-zA-Z0-9,　； \u4e00-\u9fa5]+/ig)){
			$("grouptag").innerHTML="<div style=\"background-color: #336699; border:solid 1 #FF9900; font-size:12px;width:280px; padding: 2px; auto; 2px; 30px;\"><li style=\"color:#CCCCCC\">标签中不能使用特殊字符</li></div>";
			return false;
		}else{
			$("grouptag").innerText="可填写5个，之间用空格隔开，每个标签限制为2-40个字符";
			return true;
		}
	}else{
		return true;
	}
}
function submit(){
	if(confirm() && checktag() ){
		$("form2").submit();
	}
}
//自动提示 add by bilibo 2010-07-20--------
function Getdata(obj)
{
 //获取值
	var data = jQuery(obj).val();
	var url = location.href;
	var timeoutId;
	clearTimeout(timeoutId);
	timeoutId = setTimeout(function(){
	jQuery.post(url,{tipdata:data},function(backdata)
			{displaydata(backdata,obj);});
	},10);
}	
function displaydata(backdata,obj)
{
	var offset=jQuery(obj).offset();//获得定位
	var x = offset.left;
	var y = offset.top;
	var h = jQuery(obj).height();
	var w = jQuery(obj).width();
	var left = x+"px";
	var top =  (h+y)+"px";
	var width = w+"px";
	var data = backdata.split(",");
	var ileng = data.length;
	if(data[0]!="")
	{
	jQuery("#tipdiv").css({border:"1px solid #636363",display:"block",width:width,left:left,top:top});
	jQuery("#list_tbody").empty();
	for(var i=0;i<ileng;i++)//添加结果
	{
		jQuery("#list_tbody").append("<tr><td>"+data[i]+"</td></tr>");
	}
	jQuery("td").css({width:width});
	jQuery("tr").hover(//鼠标事件
		function () {jQuery(this).addClass("mouseover");},
		function () {jQuery(this).removeClass("mouseover");}
			);
	jQuery("td").bind('click',function()//点击提交值
	{
		jQuery(obj).val(jQuery(this).text());
		jQuery("#tipdiv").css("display","none");
	}
	);
	}else{
	jQuery("#tipdiv").css("display","none");	
	}
}
jQuery(document).ready(function()//点击隐藏提示层
	{
	jQuery("*").click(function(){jQuery("#tipdiv").css("display","none");});
	}
	);

html：

<div id="tipdiv" style="position:absolute;">
			<table id="list_table" bgcolor="#fffafa" cellspacing="0" cellpadding="0" border="0">
			<tbody id="list_tbody"></tbody>
			</table>

还有待完善的地方，键盘的上下方向键还没有加上，现在出现提示后只能用鼠标选择。