Question

JQUERY

$(".share-drop .dropdown-notif").keydown(function (e) {
        e.preventDefault();
        $(this).parents('.share').find('.share-drop .dropdown-notif').show();
        if ($(this).val() == '') {
            $('.share-drop .dropdown-notif').hide();
        }
        if (e.which == 40) {
            var next = $('.selected').removeClass('selected').next('li');
            next = next.length > 0 ? next : $('.focus li:eq(0)');
            next.addClass('selected').children('a').focus();
        } else if (e.which == 38) {
            var prev = $('.selected').removeClass('selected').prev('li');
            prev = prev.length > 0 ? prev : $('.focus li').last();
            prev.addClass('selected').children('a').focus();
        }
    });

我有一个下拉选项，它会触发输入文本的键盘功能。我需要使用我的向上和向下箭头键选择这些选项我一直在尝试使用keydown，我无法进一步移动。谁能帮我这个。提前致谢。

以下是DEMO

Answer 1

我对你的小提琴进行了一些改动，在你打字之后它开始用于上下键;例如输入'te'然后按上下：

http://jsfiddle.net/c9U3s/2/

keydown事件绑定需要在input元素本身上，你需要允许preventDefault：

$(".input-hold input").keydown(function (e) {
        //e.preventDefault();

你需要一个初始选择的类，因为你的逻辑然后成功地进入，所以我把它添加到HTML：

<li class="selected"><a>testmail@test.com</a>

我认为还有一些错误可以逐步完成，（例如当你使用向下键到达列表末尾会发生什么？），但这有望让你开始。

这将向您展示如何控制下拉菜单的scrollTop，以便您可以滚动查看所选元素：

http://jsfiddle.net/c9U3s/3/

但是，有些工作需要将其改进为真正的好。

我如何定位或聚焦输入聚焦时激活的下拉列表li

1 个答案: