时间戳

首页 > 解决方案 > 在select2的下拉打开时禁用自动对焦？

javascript - 在select2的下拉打开时禁用自动对焦？

问题描述

我试图禁用内部输入搜索的自动焦点，select2尤其是在移动设备上禁用键盘弹出。但是，如此处所述：

select2不会触发本机事件。select2 也不会触发非本地版本的事件，这不是问题，因为我们仍然可以选择添加本地事件而不会破坏兼容性。

所以我能做的唯一方法是尝试让 select2 中的每个输入框当前处于焦点并设置失去焦点，但没有运气。

$("select").select2().on("select2-open",":input",function(){
    setTimeout(function(){
        $(":focus").blur();
    }, 50);
});

我有没有可能达到上述结果？谢谢。

标签： javascriptjquery-select2

解决方案

最后，我设法找到了对我来说很好的解决方案，如下所示：

/* Hide keyboard on select2 open event */
function hideSelect2Keyboard(e){
    $('.select2-search input, :focus,input').prop('focus',false).blur();
}

$("select").select2().on("select2-open", hideSelect2Keyboard);

$("select").select2().on("select2-close",function(){
    setTimeout(hideSelect2Keyboard, 50);
});

在平板电脑和 iOS 设备上测试。在函数hideSelect2Keyboard()中，我搜索了每个当前焦点元素，包括可用于初始化 select2 的输入字段，设置.prop('focus',false)将删除焦点并因此禁用键盘弹出select2-open和select2-close事件，通过链接.blur()是从元素中删除焦点边框。然后我将此功能附加到选择事件open，close它工作得很好。

我希望这会帮助其他像我一样寻找这个的人。谢谢。

推荐阅读