问问题
925 次
2 回答
1
$( document ).ready( function () {
var index = 0,
length = $( '#somemenu option' ).length;
$( '#somemenu' ).on({
change: function () {
if ( this.value === 'Trigger' ) {
$( '#togglethis').slideDown( 'slow', function() {
// Animation complete.
});
} else {
$( '#togglethis' ).hide();
}
},
keydown: function ( event ) {
if ( event.which === 38 ) {
index--;
if ( index < 0 ) {
index = length - 1;
}
} else if ( event.which === 40 ) {
index++;
if ( index >= length ) {
index = 0;
}
}
// Now index refers to the current index of the option element.
// You can now run your required animation
// Eg: animate( index );
}
});
});
您可以做的是在(38 为 up 和 40 为 down )'#somemenu'
的基础上监听 keydown 事件,以这种方式运行您的事件event.which
于 2013-02-11T02:44:13.243 回答
1
发表我的评论作为答案:
我测试了你的代码,我觉得它的行为符合我的预期。如果您下拉选项列表并使用光标键上下移动突出显示,则不会触发更改事件,因为选择不是最终的,直到您按 Enter 使当前突出显示的选项成为选定选项。
如果您想“预览”选择的效果,也许您可以连接到选择的 keyup/keydown 或 keypress 事件,并在其中检查键是否是向上/向下箭头键,然后使用它来执行您的 UI 更新.
于 2013-02-11T12:20:05.483 回答