Question

Jsfiddle是here。

我有一个文本框，并且框中的用户键入键，multiple select框必须刷新其选项。

在input change上，我使用此代码刷新select options，

$("select").empty()  
 filteredOpts.map(function(val){
        $("select").append("<option name={0} value={0}>{0}</option>".format(val))
})

但是，视图没有使用新的选项集刷新。

当我移动到某个屏幕时（例如，按ctrl + shift + c打开chrome控制台），视图会刷新。在firefox中也可以看到相同的行为，其中选择框没有显示已过滤的选项，但是当我转到firebug控制台并返回时，选择框已刷新其选项。

Answer 1

这是因为你只是 处理Change事件，而不是像你说的那样处理Input事件。只有在元素模糊后才会触发Change事件。

变化：

$("body").on("change", "#pattern", textChange)

要：

$("body").on("input change", "#pattern", textChange)

（你也可以完全放弃Change事件。）

Working JSFiddle demo

Answer 2

当您将焦点放在文本框外时，

将触发更改事件。请keyup事件代替change尝试此$("body").on("keyup", "#pattern", textChange)。

清空时选择框不刷新，然后添加返回选项

2 个答案: