In the createSelect() function, return an object, and the two methods of this object are next()
and moveSelect() called in prev() can correctly point to the function, or it can also be used to
The moveSelect() function is placed outside.
The code copy is as follows:
/* Recommended choices for keyboard operation and problem*/
var curDo = null;
var select = createSelect();
$('#keywords').keyup(function(e){
var theEvent = e || window.event;
code = theEvent.keyCode ? theEvent.keyCode : (theEvent.which ? theEvent.which : theEvent.charCode)
var KEY = {
UP: 38,
DOWN: 40,
DEL: 46,
TAB: 9,
RETURN: 13,
ESC: 27,
BACKSPACE: 8,
LEFT:37,
RIGHT:39
};
clearTimeout(curDo);// When the keyboard pops up, the timed ajax data acquisition operation should be canceled.
switch(code) {
case KEY.UP:
select.next();
break;
case KEY.DOWN:
select.prev();
break;
case KEY.RETURN:
$('.suggest-hover').trigger('click');
break;
case KEY.LEFT:
break;
case KEY.RIGHT:
break;
default:
curDo = setTimeout(getSuggest(),300);
break;
}
});
/* suggest selection operation*/
function createSelect(){
var CLASSES = {
ACTIVE: "suggest-hover"
};
function moveSelect(step) {
var listItems=$('.suggest-results li');
//The current number of steps of hover
var active;
active = $('.'+CLASSES.ACTIVE).index();
listItems.eq(active).removeClass(CLASSES.ACTIVE);
active += step;
if (active < 0) {
active = listItems.size() - 1;
} else if (active >= listItems.size()) {
active = 0;
}
var activeItem = listItems.eq(active).addClass(CLASSES.ACTIVE);
};
return {
next:function(){
moveSelect(-1);
},
prev:function(){
moveSelect(1);
}
};
};
The above is all the content shared by this article. I hope you like it