您的位置:首页 > 其它

模拟谷哥,和百度的输入自动提示框

2011-02-23 18:48 260 查看
//sam add 获得model 相似列表
var _indexlen=0;
var _index=-1;
var _lilist=null;
var _lilistdiv=null;
var evsrc=null;
var responsehtml='';
//xajax.callback.global.onRequest = function(){alert('开始');}; //xajax 提交前
xajax.callback.global.onComplete=function(){initlilist();}; //xajax 请求完毕事件
$('input[name=model[]]').bind("keyup",function(e){
evsrc=$(e.target);
switch(e.keyCode){
case 40://方向键下
if(_indexlen>0){
if(_index==_indexlen) _index=-1;
$(_lilist[_index+1]).css('background','#ffffff');
if(_index>=0) $(_lilist[_index]).css('background','');
_index=_index+1;
}
break;
case 38://方向键上
if(_indexlen>0){
if(_index==-1) _index=_indexlen;
$(_lilist[_index-1]).css('background','#ffffff');
if(_index>=0) $(_lilist[_index]).css('background','');
_index=_index-1;
}
break;
case 13://回车键
if(_indexlen>0){
$(e.target).val(_lilist[_index].innerHTML);
_lilistdiv.remove();
}
break;
default://默认为提交查询
var p=$(e.target).parents("tr");
var val=$(e.target).val();
var bigclassid =p.find('.bigclassid').val();
var smallclassid=p.find('.smallclassid').val();
var brandid=p.find('.brandid').val();
xajax_getLikemodel(bigclassid,smallclassid,brandid,val); //xajax 函数调用
}
})

$(document).bind("click",function(e){
if(_lilistdiv!=null) _lilistdiv.remove();
});
function initlilist(){
$(evsrc).parent().css("position","relative");
//responsehtml="<ul><li>xxxxxxx1</li><li>xxxxxxxxx3</li></ul>";
_lilistdiv=$("<div class=sam_pop >"+responsehtml+"</div>");
$(evsrc).parent().append(_lilistdiv);
_lilistdiv.find("li").bind("click",function(e){
evsrc.val($(e.target).html());
_lilistdiv.remove();
});
_lilistdiv.find("li").bind("mouseover ",function(e){
_lilistdiv.find("li").css('background','');
$(e.target).css('background','#ffffff');
});
_lilist=$(evsrc).parent().find('li');
_indexlen=_lilist.length;
_index=-1;
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: