Question

我在最近的项目中使用了twitter bootstrap。除了其中一个页面外，一切正常。

点击链接会显示一个模态，我可以使用关闭按钮或模式右上角的关闭图标关闭该模式。

但是我使用关闭按钮关闭模态，然后尝试再次打开它（或任何其他链接）关闭按钮被禁用，我只能使用右上角的图标关闭模态。

下面是jsfiddle的链接，其中包含我的代码副本，您可以在其中查看结果。

链接只传递一个数据模式，但这尚未实现。

<h3>Select a role to edit it.</h3>
<div style="width:auto">
<ul class="nav nav-pills nav-stacked">
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(920)Active Directory Management</a></li>
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(904)Cisco Router - Administration </a></li>
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(914)Cisco Router - Installation</a></li>
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(918)Development - Analysis</a></li><li><a href="#" data-toggle="modal" data-target="#roleEditModal">(908)Development - Project Management</a></li>
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(936)Fire Wall - Administration</a></li>
</ul>
</div>        
        <!-- Modal -->
        <div class="modal" id="roleEditModal" tabindex="-1" role="dialog" aria-labelledby="roleEditModalLabel" aria-hidden="true">
            <div class="modal-dialog">
            <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
            <h4 class="modal-title" id="editModal">Edit role:</h4>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
            <button type="button" id="btn_roleEditClose" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>

http://jsfiddle.net/dzfbyu6t/

有人可以看看它，让我知道我的问题在哪里。感谢

Answer 1

您添加的javascript导致问题。

    $(".btn").click(function(e) {
    if (! $(this).hasClass("disabled"))
        {
            $(".disabled").removeClass("disabled").attr("rel", null);

            $(this).addClass("disabled").attr("rel", "tooltip");
        }
    });

如果你发表评论，这项工作正常。 http://jsfiddle.net/dzfbyu6t/1/

Bootstrap模态问题

1 个答案: