Question

我有一个视图，我在触发下拉列表时提供了许多选项，当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'事件存在时，该选项的click事件不会触发。如果我删除焦点事件（或模糊事件），则单击工作。

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

以下是准系统示例http://jsbin.com/bivilujili/1/edit?html,js,console,output

Answer 1

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

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

当'焦点'事件存在时，BackboneJS'点击'事件无法触发

1 个答案: