Question

我正在尝试实现自动完成搜索，在该操作中我将写一些东西，并且相关数据将显示在自动完成搜索中，但是我也想用条形码扫描仪输入来填充输入框。当输入框充满扫描仪时，将提示相关数据。但是我在写一些东西时会遇到这个问题，它显示了相关数据，但是当在输入框中填写条形码扫描输出时，它并不建议..我该如何实现？

HTML代码：

<input type="text" required autofocus  class="form-control m-input" id="customerSearch" placeholder="Customer name">

JavaScript代码：

    $('#customerSearch').autocomplete({
       source: '{!! asset('customerSearch') !!}',
       select: function(suggestion,ui) {
           // $("#customer_id").val(ui.item.id);           
       }
    })

Answer 1

在按下键盘事件时会触发自动对焦，因此代码扫描器不会触发它。输入更改后，您必须自己触发事件。试试这个：

html{
    background: url('https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png') no-repeat 0 0 scroll;
    background-color:#0C0C0C;
    background-size: 100% 100%;
    height:100%;
    width:100%;
}

Answer 2

将值插入输入不会触发事件

我建议尝试以下操作来触发事件，如果该事件有效，则应触发jQuery自动完成更新。

创建事件：

const event = new Event('keydown')

然后调度此事件：

customerSearch.dispatchEvent(event)

使用jQuery也可以：

jQuery('#customerSearch').trigger('keydown')
// or
$('#customerSearch').trigger('keydown')

您将要在代码扫描器更改输入值后触发/调度事件。看起来像这样：

customerSearch.value = codeScannerValue
// or however it actually works

$('#customerSearch').trigger('keydown')
// or
customerSearch.dispatchEvent(new Event('keydown'))

自动完成建议输入框，其中装有条形码扫描仪

2 个答案:

将值插入输入不会触发事件