Bootstrap Select 与 JQuery 虚拟键盘冲突

Question

这是一个很好的。基本上，我特别使用两个库来获得我想要的东西。引导选择：

https://silviomoreto.github.io/bootstrap-select/

和 JQuery 虚拟键盘：

https://mottie.github.io/Keyboard/

（添加链接以防有人发现它们对自己的东西有用）

我使用引导选择是因为作为选择组显示的查询数据非常大，因此在其中添加一个输入字段实用程序以使我们的用户更简单是有意义的。我们还需要一个虚拟键盘，这正是我们添加 jquery 插件的原因。问题是当我们触摸选择输入并且键盘出来时，我们输入的任何内容都不会被过滤。也没有添加，到目前为止，键盘似乎只适用于常规输入文本字段

在最简单的形式中，这是我用来生成键盘以及初始化选择选择器的代码：

let virtualK = ()=> {
    $('.buscame')
          .keyboard({
            layout: 'qwerty',
            position: {
              of : $(window),
              my : 'center bottom',
              at : 'center bottom',
              at2: 'center bottom'  
            }
          })
          .addTyping();
  }
  $(document).ready(function(){
    $('#example').selectpicker({});
    $('#Transfer').selectpicker({});
    $('#Chofer').selectpicker({});
    $('#Transportista').selectpicker({});
    $('#localidad').selectpicker({});
    $('#Cliente').selectpicker({});

    // Initialize the keyboard
    virtualK();
  });

至于选择标签，代码如下：

<select name="Transfer" size="1" id="Transfer" class="form-control select-picker buscame" data-live-search="true" required onChange="javascript:OnChangeOperador()">

我面临的另一个问题是，如果我尝试通过传递 .buscame 作为标识符来运行 JS 代码，那么键盘不会显示，而如果我选择通用标识符为 input 它可以工作。 bootstrap select 的文档没有显示为其自动生成的输入框添加 id 的任何方法，因此这似乎不是一个选项（如果有人知道，请告诉）

那么，有没有人知道让虚拟键盘在自定义选择的内部搜索框上工作的方法？或者如何在生成的输入过滤字段中添加一个id？

编辑：

我尝试过使用

let virtualK = ()=> {
    $('input[role="textbox"]')
          .keyboard({
            layout: 'qwerty',
            position: {
              of : $(window),
              my : 'center bottom',
              at : 'center bottom',
              at2: 'center bottom'  
            }
          })
          .addTyping();
  }

但它的作用相同，虚拟键盘会打开，但我输入的任何内容都不会被过滤。

花了我一段时间，因为 jsfiddle 和 jsbin 很有趣，但这里是这个问题的娱乐：

https://codepen.io/AlecX4/pen/vJvmLb?editors=0000

Answer 1

您需要设置相关输入的值并触发该输入的propertychange，以告知bootstrap-select输入的值已更改。

change: function(e, keyboard) {
    keyboard.$el.val(keyboard.$preview.val())
    keyboard.$el.trigger('propertychange')        
  }

以下是您的 codepen 的更新：
https://codepen.io/anon/pen/EvGpvz