流星 + Bootstrap - 警报 closed.bs.alert 不触发

Question

我正在使用 Meteor 和 Bootstrap，以及 nemo64:bootstrap 软件包。在 custom.bootstrap.json 我有 "alerts" 和 "alert"。

我正在尝试在模板事件中捕获 closed.bs.alert 事件。由于某种原因，它不会捕获。

Template.alert.events({
    'closed.bs.alert .alert': function () {
        console.log('closed'); // does not trigger
    }
});

奇怪的是，close.bs.alert 确实有效：

Template.alert.events({
    'close.bs.alert .alert': function () {
        console.log('closed'); // triggers
    }
});

此外，如果我通过 jQuery 添加事件，我可以捕获 closed.bs.alert:

$('.alert').on('closed.bs.alert', function () { 
   console.log('closed'); // triggers
});

所以，我知道我的事件格式正确并且我知道 closed.bs.alert 事件正在触发...但是由于某种原因我无法用 Template.alert.events.[=21 捕获它=]

有什么想法吗？

Answer 1

我深入研究了 Bootstrap 代码并找到了触发此事件的位置：alert.js, line 50

首先，我得到的技术：

Templates.alert.onRendered({
    $('.alert').on('closed.bs.alert', function (e) {
        console.log('closed'); // triggers =D
    });
});

我认为问题在于 Bootstrap 在触发事件之前分离了警报，因此 $(document).on('closed.bs.alert', '.alert') 之类的东西无法工作。我不确定 100%，但我怀疑 Meteor 的 Template.my_template.events() 触发器也使用非常相似的方法。

通常这会起作用：

$(function () {
    $('.alert').on('closed.bs.alert', function () {
        console.log('closed'); // doesn't trigger
    });
});

但是，Meteor 破坏了该计划，因为我正在从数据中加载警报，但在触发警报时它们不存在。

但是，将 jQuery 样式 on() 放入 Template.my_template.onRender() 似乎可以解决问题。

此外，Bootstrap 不会引发事件，除非警报具有 "fade" class。您可以在不包括 "transition" 模块的情况下分配淡入淡出 class。如果你离开它，你就不会得到效果，但无论如何都会触发事件。

流星 + Bootstrap - 警报 closed.bs.alert 不触发

Meteor + Bootstrap - Alert closed.bs.alert does not trigger

javascript

twitter

jquery

meteor

twitter-bootstrap-3