jquery autocomplete使mCustomScrollbar在select上滚动到顶部

Question

我在后台接口中实现了mCustomScrollbar插件.它工作正常.但在我的一个表单中,我有一个需要自动完成的城市字段.

自动完成也很好.但是当我从自动完成源数据中选择一个项目时,mCustomScrollbar插件会自动将我带到滚动内容的顶部,我必须再次单击以实际选择该项目.

这是我实现滚动条插件的方式:

$('#mainContent').mCustomScrollbar({
        set_height: height,
        scrollInertia: 500,
        scrollEasing: "easeInOutQuad",
        mouseWheel: 20,
        autoDraggerLength: true,
        advanced: {
            updateOnBrowserResize: true,
            updateOnContentResize: false
        }
    });

这就是我实现自动完成的方式:

el.autocomplete({
    source: function (request, response) {
        $.ajax({
            url: activityAutocomplete,
            dataType: "json",
            data: request,
            success: function (data) {
                if (data.length == 0) {
                    data.push({
                        label: "Pas de résultat"
                    });
                }
                response(data);
            }
        });
    },
    //If overflow edge of window, the autocomplete flips to top of input
    position: { collision: "flip" },
    autofocus: true,
    delay: 150,
    minLength: 1,
    select: function (event, ui) {
        //ui.hide();
        //The following code resizes the input by bluring it.
        setTimeout(function () { el.autoGrowInput(); }, 50);


    },
    appendTo: '#autocomplete-tb-city-' + el.parents('.item').attr('id')
});

我希望你在这里找到错误,我已经在这3天了!

编辑:这是生成的自动完成标记.

<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all"   role="listbox" aria-activedescendant="ui-active-menuitem">
    <li class="ui-menu-item" role="menuitem"><a class="ui-corner-all" tabindex="-1">Angers</a</li>
    <li class="ui-menu-item" role="menuitem"><a class="ui-corner-all" tabindex="-1">Amiens</a</li>
</ul>

我必须添加一些可能是重要的东西:即使在正确的点击它也会让我达到顶峰!

谢谢.

Answer 1

新版本的自定义scrollbars具有高级选项autoScrollOnFocus.

例:

        $($element).find('> .scrollbars').mCustomScrollbar({
            horizontalScroll: false,
            autoDraggerLength: true,
            autoHideScrollbar: true,
            advanced:{
                autoScrollOnFocus: false,
                updateOnContentResize: true,
                updateOnBrowserResize: true
            }
        });

Answer 2

我在自动完成方面遇到了同样的问题。选择任何自动完成项目会将窗口滚动到顶部。

我在这里看到了您的评论，我认为您已经找到了解决方案。

使用您在上面链接中提到的提示，我浏览了 mcustomscrollbar.js 代码，只是注释掉了第 533 行和第 534 行，是的，它对我有用。

谢谢你的提示。干杯！