2

我正在实现一个 Select2，当我想要保存所选项目的字段失去焦点时，用户应该能够选择多个项目。我尝试使用 select2-blur 事件，但它经常被触发。一旦选择了一个选项，它就会触发。select2 使用以下命令创建：

$(test).select2({
  data:[
    {id:0,text:"Item 1"},
    {id:1,text:"Item 2"},
    {id:2,text:"Item 3"},
    {id:3,text:"Item 4"},
    {id:4,text:"Intem 5"}
  ],
  multiple: true,
  width: "300px"
});

$(test).on("select2-blur", function(e) { doStuffOnLostFocus();});

我创建了一个小提琴，您可以在其中看到多次触发模糊事件，而不是在 select2 控件上失去焦点时：http: //jsfiddle.net/Wp8Wf/

只有当用户离开 select2 时，任何人都有一些关于如何做事的好主意？

4

2 回答 2

3

好吧，该插件具有自定义事件，因此无法“捕获”该blur事件，因为它在向选择添加元素以及打开/关闭选项下拉列表时创建了自己的事件。

这是一个可行的解决方法，但需要根据您可能拥有的其余代码进行微调。

我找到了一个只在关注.select2-container-active时才存在的类select2。但这class在每个新的选择中来来去去。所以我所做的是setTimeout等待select2代码工作。如果class仍然存在，那么它仍然集中在select2. 如果class不再存在，它将认为这是“正常”blur并运行日志功能。这给了一个小小的延迟，但这select2是有罪的:)

test.on("select2-blur", function (e) {
    setTimeout(function () {
        var active = $('#s2id_test').hasClass('select2-container-active');
        if (active) {
            return false;
        }
        log("Blur");
    }, 300);
});

小提琴

于 2013-08-25T18:47:15.390 回答
2

这是旧的，但最新版本的 select2 有一整套事件要监听。没有模糊，但select2:close它非常接近模糊事件。

$('#my_id').on('select2:close', event => doStuffOnLostFocus(event));
于 2020-07-20T01:51:18.617 回答