Question

我需要捕获页面上其他位置的对象上的事件（如点击），而不是select2对象的子节点，而select2对象具有焦点并显示结果。当select2结果对象被聚焦时，我无法单击页面上其他位置的按钮/锚点并让它执行其操作。它只是关闭了select2对象。

有办法做到这一点吗？以下是演示此行为的演示：http://codepen.io/anon/pen/JoJobW

   <!-- Javascript snippet -->
   $(document).ready(function() { 
       $("#e1").select2(); 

       $("#e2").click(function(){
         alert("click!");
         e.preventDefault();
       });
   });

   <!-- HTML snippet -->
   <select id="e1"></select>
   <a href="#" id="e2">Click here when select2 is focused</a>

使用select2 v3.5.2和jQuery 1.11.0

Answer 1

选择2放置一个＆＃34;掩码＆＃34;捕获鼠标单击的下拉列表后面的元素。关于此事Others have complained。

这是显示遮罩元素的jsfiddle。

打开下拉列表时，您可以尝试删除遮罩元素。

$('#e1').select2().on('select2-open', function() {
    $('.select2-drop-mask').remove();
});

当然，这意味着当用户点击它时，下拉列表不会关闭，但您可以在文档（或正文）上添加事件处理程序来执行此操作。

$(document).click(function() {
    $("#e1").select2('close');
});

在这种情况下，您必须确保其他元素上的click事件不会传播到文档。

$('#e2').click(function() {
    alert('click!');
    return false; // Prevent default action and stop propagation.
});

jsfiddle

单击远离聚焦Select2时触发事件

1 个答案: