Question

我试图用twitter bootstrap的模式实现一些javascript，它在jsFiddle上工作正常但在我的网站上不起作用。

HTML：

<a href="#Modal1" class="link-glow" data-toggle="modal">link</a>

<div class="modal fade" id="Modal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body" id="modalBody"></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

使用Javascript：

$('#Modal1').on('show', function () {
    $('#modalBody').html('<iframe width="560" height="315" src="//www.youtube.com/embed/8LCiz7OpfnQ?list=PLVL8S3lUHf0SxTfeIL55AGkEAd2zVPPbl" frameborder="0" allowfullscreen></iframe>');
}).on('hide', function () {
    $('#modalBody').html('');
});

请问有谁可以帮我弄清问题是什么？非常感谢！

Answer 1

根据Bootstrap文档，您要使用的事件是show.bs.modal和hide.bs.modal。

请参阅http://getbootstrap.com/javascript/#modals-usage

所以你的代码是：

$('#Modal1').on('show.bs.modal', function(event) {...}).on('hide.bs.modal', function(event) {...})

Javascript不适用于twitter bootstrap模式

1 个答案: