javascript - 选择导致键盘出现在 Android 上

Question

在 Android 上，触摸选择器时，会出现键盘输入。我怀疑这是因为生成的输入是 type="text"。

如何防止这种情况发生？如果用户从下拉列表中进行选择，出现键盘是没有意义的。

我正在将 selectize 实现为 Angular 模块 angular-selectize ，但我与开发人员核实后发现问题并非特定于 Angular 包装器。

这是我的代码:

        <selectize  ng-model="filters.min_bedrooms" 
                    options="[
                            {title:'0', id:0},
                            {title:'1', id:1},
                            {title:'2', id:2},
                            ]">
        </selectize>

生成此标记:

<input type="text" autocomplete="off" tabindex="" style="width: 4px; opacity: 0; position: absolute; left: -10000px;">

Answer 1

我遇到了同样的问题，我希望用户选择一个值但不输入任何新值，并且当您在 iPad 上点击下拉菜单时总是会出现键盘。我已经解决了这个问题:

$('#myDropDownId').selectize({
    create: true,
    sortField: 'date'
});
$(".selectize-input input").attr('readonly','readonly');

基本上发生的事情是，当您单击/点击下拉菜单时，输入会获得焦点，这就是显示键盘的内容。通过将 readonly 设置为 false，输入不再获得焦点。

我已经在 iPad Mini 2 的 Safari 和 Chrome 中测试过这个。