<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<ul>
<li><input type="text" /></li>
<li>
<ol class="one">
<li><input type="text" /></li>
<li><input type="text" /></li>
<li><input type="text" /></li>
<li><input type="text" /></li>
<li><input type="text" /></li>
</ol>
</li>
</ul>
<ol class="two">
<li><input type="text" /></li>
<li><input type="text" /></li>
<li><input type="text" /></li>
<li><input type="text" /></li>
<li><input type="text" /></li>
</ol>
<dl>
<dd><input type="text" /></dd>
<dd><input type="text" /></dd>
<dd><input type="text" /></dd>
<dd><input type="text" /></dd>
<dd><input type="text" /></dd>
</dl>
<script>
$(function() {
var flag = false,index=0;
function focusZ($lis) {
$lis.keydown(function(event) {
if(!flag){
return false;
};
switch(event.keyCode) {
case 38:
if(index!=0){
focusL($lis,index-1);
};
console.log(index);
console.log('上')
break;
case 40:
if(index!=($lis.length-1)){
focusL($lis,index+1);
};
console.log(index);
console.log('下');
break;
};
});
};
function focusL($lis,num) {
$lis.eq(num).find("input").focus();
};
function Lifocus(obj){
obj.on("focus","input",function(){
flag=true;
index = $(this).parent('li').index();
console.log(index);
});
focusZ(obj);
}
Lifocus($(".one li"));
Lifocus($(".two li"));
Lifocus($(".dl dd"));
})
</script>
</body>
</html>
