"show"事件不会在IE9中使用Twitter引导模式在Rails中触发

Question

我遇到了一个问题，涉及两个不同的框架/lib，尽管主要是TwitterBootstrap（js）和Rails。

我的应用程序中有一个链接，它会用一些js:进行响应

$(function() {
    var $modal = $('<%= escape_javascript( render 'front_end/bookings/modal', :product => @product, :customer => @customer, :booking => @booking ) %>'),
        $calendar = $modal.find('#calendar'),
        currentProduct = <%= raw(@product.to_json) %>;,
        initBookingCalendar;
    $('body').append($modal);
    $modal.modal('show');
    /* Booking Calendar */
    initBookingCalendar = function(el, productId) {
        el.fullCalendar()
        ...
    };
    $($modal).on('shown', function() {
        if($calendar.is(':empty')) {
            initBookingCalendar($calendar, <%= @product.id %>);
        }
    });
});

问题是"显示"事件由于某种原因没有在IE9中启动！？我在这里重现了这个问题：http://jsfiddle.net/tvkS6/并通过这样做使其发挥作用：http://jsfiddle.net/tvkS6/9/。问题是我不知道如何在我的代码中实现解决方案，因为我并不真正理解问题是什么

我必须使用initBookingCalendar等待模式完全显示的原因是，jQueryFullCalendar插件要求元素在呈现日历之前是可见的。

如有任何提示，不胜感激！

Answer 1

在第一次调用show()方法之前，需要将侦听器的附加移动到。

$modal.on('shown', function() {
    if($calendar.is(':empty')) {
        initBookingCalendar($calendar, <%= @product.id %>);
    }
});
$modal.modal('show');

它可能在非IE浏览器中工作的原因是它们支持CSS转换，这使得触发shown事件的代码是异步的。由于IE不支持它，所以show()方法是同步执行的，并且在附加侦听器之前会触发shown事件。

---

更新

下面是一个演示，它验证了我对您的示例在其他浏览器中工作的原因的解释。通过设置

$.support.transitions = false;

Modal.show()方法将在所有浏览器上同步运行，因此，您的示例现在将在Chrome、FF等中失败

JSFiddle演示不该做什么