大家好，又见面了，我是你们的朋友全栈君。
1.select下拉框一定要放到layui-form类下。这个layui-form不是必须放在form上，放在一个div也是可以的
2.要注意每次form render之后呢，要重新注册事件。
<script type="text/javascript">
/***********layui下拉框选择,支持键盘*************/
layui.use('form', function(){
var form = layui.form;
var $ = layui.$;
form.render();
//每次渲染之后手注册事件
$("dl").prev().find("input").attr("onkeydown","listenSelect.up(event,this)");
});
var listenSelect = {
style:"layui-this",
up:function (event,thisinput) {
var keyCode = event.keyCode;
var dl = $(thisinput).parent().next(); //找到渲染后的dl
var curDd =(dl).find('.layui-this');
if(keyCode==40){ //按下下键
$(thisinput).parents('.layui-form-select').addClass('layui-form-selected');
curDd = $(dl).find('.layui-this').nextAll(':not(.layui-hide)');
if(curDd.length == 0){
// curDd = $(dl).find('dd:first');
curDd = $(dl).find('dd').not(".layui-hide").first();
}else{
curDd = curDd[0];
}
}else if(keyCode==38){
$(thisinput).parents('.layui-form-select').addClass('layui-form-selected');
curDd = $(dl).find('.layui-this').prevAll(':not(.layui-hide)');
if(curDd.length == 0){
curDd = $(dl).find('dd').not(".layui-hide").last();
}else{
curDd = curDd[0];
}
}
dl.find("dd").removeClass(this.style); //移除样式
$(curDd).addClass(this.style);
var dd = $(dl).find('.layui-this');
// 计算高度--start
try{
dd.offset().top - dl.offset().top + dl.scrollTop();
dl.scrollTop(
dd.offset().top - dl.offset().top + dl.scrollTop()-100
);
}catch(err){
//console.log(err.stack);
}
// 计算高度--end
if(keyCode == 13){
$(dd).click();
$(thisinput).focus(); // 再次得到焦点
$(thisinput).attr("onkeydown","listenSelect.up(event,this)")
}
return false;
}
};
/********END*******/
</script>
转载于:https://my.oschina.net/Skynet01/blog/1923890
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/107374.html原文链接：https://javaforall.net
