jQuery选择插件:捕获焦点以在Tab时打开

jQuery Chosen Plugin : Capturing focus to open when tabbing

本文关键字：Tab 焦点 插件 选择 jQuery      更新时间：2023-09-26

我们目前正在使用选择的下拉插件，除了一个小问题，它非常棒。 当我们使用单个下拉列表时，如果按 Tab 键进入"选择"控件，则不会显示实际的下拉列表部分。 但是，当将插件应用于多个"选择"时，它确实会出现。

在浏览了文档和 GitHub 问题之后，似乎有很多关于选项卡排序和聚焦的提及，但似乎没有涉及这个相当简单的要求;在 Tab 键接收焦点时显示下拉列表。

因此，假设此功能不是插件的一部分，是否有替代方法，例如捕获锚标签的焦点？ 

$('.chzn-single').focus(function(e){
    alert('I should be focused!')
});

到目前为止，我还没有成功，想知道是否有其他人遇到过这个问题。 你可以看看这个演示问题的jsfiddle

  1. 您应该跟踪所选 conainer 内部搜索输入的焦点事件，而不是锚元素，然后触发所选容器的 mousedown 事件 - 这是它在打开下拉列表时侦听的事件

  2. 您需要使用委托事件方法将事件处理程序绑定到动态添加的元素（对于 jquery 1.7.1 及更早版本，您可能只使用"live"方法）

  3. 您还需要检查容器当前是否处于活动状态，以避免递归调用（当打开所选下拉列表时 - 搜索输入将再次聚焦）

$（'body'）.on（'focus'， '.chzn-container-single input'， function（） {    if （！$（this）.closest（'.chzn-container'）.hasClass（'chzn-container-active'））        $（this）.closest（'.chzn-container'）.trigger（'mousedown'）;        或改用这个        $（'#select'）.trigger（'liszt：open'）; });

这是工作 jsfiddle

而不是$(this).closest('.chzn-container').trigger('mousedown');您还可以触发插件的内部事件：$('#select').trigger('liszt:open');

相关文章：