Bootstrap show.bs.modal 事件在 Firefox 上不起作用

Question

我正在使用引导事件在显示模式对话框后触发。在 Chrome 上，一切都像一个魅力，但在 Firefox 中，该事件永远不会触发。我的 Firefox 版本是 38.05。这是我的代码：

    $(document).on('show.bs.modal', function () {
        $(elementEvents).each(function( i, event ) {
            console.log("binding event index " + i +" for  type " + event.type);
            currentElement.bind(event.type,event);
        });
    });

如果我改变这一行

   $(document).on('show.bs.modal', function () {

通过这个作品

    $("*").on('show.bs.modal', function () {

知道为什么 Firefox 不解释文档吗？

Answer 1

您必须将event 绑定到实际的模态。

$('#exampleModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var recipient = button.data('whatever') // Extract info from data-* attributes
  // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
  // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
  var modal = $(this)
  modal.find('.modal-title').text('New message to ' + recipient)
  modal.find('.modal-body input').val(recipient)
});

这是一个有效的example。

或者你可以将它绑定到类：

$('.modal').on('show.bs.modal', function (event) {
    alert('here I am!');
    console.log(event);
});

$('.modal').on('hidden.bs.modal', function (event) {
    alert('bye bye!');
    console.log(event);
});

如图所示jsFiddle。

Answer 2

我刚刚遇到了这个问题...我将代码移到了 jQuery(document).ready() 中，现在它可以为我工作了。

jQuery(document).ready(function () {
    jQuery('.modal').on('hidden.bs.modal', function (e) {
        // whatever you want to do
    });
});