当前位置: 代码迷 >> JavaScript >> jQuery:如果子div处于焦点,如何防止向下按钮向下滚动父div
  详细解决方案

jQuery:如果子div处于焦点,如何防止向下按钮向下滚动父div

热度:29   发布时间:2023-06-13 12:11:58.0

我在自动完成搜索框上工作。 一切工作正常,但当用户按下向下键滚动浏览搜索结果时,父div也会向下滚动。 如果子div或ul处于焦点状态,如何防止父div滚动。

    <div id="parentdiv">
        <div id="autoholder" tabindex='1'>
            <ui class="autodropdown"> 
                 // result is populated here using ajax 
                 // for example
                 //<li>first result</li>
                 //<li>second result </li> and so on....
            </ui>   
        </div>
    </div>

对于js我有

$(window).keydown(function (e) {
    if (e.which === 40) {
        $('#autoholder').focus();
        if ($('ul.autodropdown li').hasClass('active')) {
            var h = $('ul.autodropdown li.active').index();
            $("ul.autodropdown li:eq(" + h + ")").removeClass('active');
            next = $("ul.autodropdown li:eq(" + h + ")").next();

        } else {
            $("ul.autodropdown li:eq(0)").addClass('active');
        }
    } else if (e.which === 13) {
        alert($('ul.autodropdown li.active').text());
    }
});

当用户在#autoholder处于焦点状态时按下向下按钮时,我只希望用户仅在#autoholder div中向下,而不在父div或主体中向下。

谢谢你的帮助!

有两个问题。

您有一个小错别字:不是您正在使用

您不会阻止默认的事件行为。 尝试这样的事情:

e.preventDefault();
  相关解决方案