Mozilla中的Bootstrap 3模态没有显示

时间:2016-12-27 00:50:32

标签: jquery html css twitter-bootstrap twitter-bootstrap-3

嘿伙计们我正在使用bootstrap v3.3.7并且我制作了bootstrap模式,现在一切都在chrome和safari上运行正常,但由于某种原因它不适用于mozilla。当我按下mozilla中的模态按钮时没有任何反应。这是我的代码:

<button type="button" class="btn btn-lg accountBtn">
    <a href="#modal1" data-toggle="modal">Account details</a>
</button>

<div class="modal fade" id="modal1" role="dialog" style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header text-center">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h2>Header h2</h2>
                <h3>Header h3</h3>
                <ul class="characteristicsList">
                    Characteristics:
                    <li><img src="images/modal1.png" alt="">Property: </li>
                    <li><img src="images/modal2.png" alt="">Property: </li>
                    <li><img src="images/modal3.png" alt="">Property: </li>
                </ul>
                <button type="button" class="btn btn-lg buyBtn">
                    <a href="myPaypalLink" target="_blank">Buy Now X$</a>
                </button>
            </div>
        </div>
    </div>
</div>

我的按钮带有“a”标签,我在我的模态中使用,而且在我的html中也没有模态:

<button type="button" class="btn btn-lg buyBtn">
    <a href="myPaypalLink" target="_blank">Buy Now X$</a>
</button>

在mozilla中不起作用。

1 个答案:

答案 0 :(得分:2)

将锚标记a放在button标记内是错误的。只需使用锚标签,一切都会正常工作。

<a href="#modal1" data-toggle="modal" type="button" class="btn btn-lg accountBtn">
    Account details
</a>