javascript - 当 'click' 事件存在时，BackboneJS 'focusout' 事件不会触发

Question

我有一个 View ，其中触发下拉菜单，当 BackboneJS 中的文本输入处于焦点时(类似于 Select2 的想法)，该下拉菜单提供了许多选项:

events: {
   'click .option': 'clickItem',
   'focusin .big-select-input': 'focusIn',
   'focusout big-select-input': 'focusOut'
},

focusIn: function() {
   this.$el.find('.big-select-options').show();
},

focusOut: function() {
   this.$el.find('.big-select-options').hide();
},

clickItem: function() {
   console.log('item clicked');
}


<input type="text" class="big-select-input" />
<div class="big-select-options" style="display:none;">
<div class="option">Item</option>
<div class="option">Item</option>
<div class="option">Item</option>
<div class="option">Item</option>
</div>

我注意到，当“focusout”事件存在时，选项的单击事件不会触发。如果我删除焦点事件(或模糊事件)，则单击有效。

如何让点击和焦点同时工作？

这是一个简单的示例 http://jsbin.com/bivilujili/1/edit?html,js,console,output

Answer 1

如果我理解正确的话，你认为你正在点击一个选项，但事实并非如此。当您尝试单击某个选项时，输入必须失去焦点。当输入失去焦点时，您将隐藏选项的容器。所以你不能再点击它了。他们只是隐藏起来。

您需要更新逻辑才能不隐藏它们。