模态未在IE 11上打开

时间:2017-02-11 09:48:49

标签: javascript jquery twitter-bootstrap internet-explorer bootstrap-modal

所以我有一个模式向用户显示一些内容。它适用于所有浏览器,但不适用于IE 11及其较低版本。

这是模态打开的文本:

<a class="btn btn-link open-modal" href="#">Have a question?</a>

当我进一步检查定义模态内容的代码时,它是这样的:

<div tabindex="-1" class="modal fade contact-admin" id="contact-admin" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
        <div class="modal-body">
            <span class="text-center"><strong>Please contact the admin via email</strong></span> <br><br>
            <address>
                <strong>Name:</strong> Mr Saxena <br>
                <strong>Email:</strong> saxena@gmail.com
            </address>
        </div>
            <div class="modal-footer">
            <button class="btn btn-default no" type="button" data-dismiss="modal">Close</button>
        </div>
        </div>
    </div>
</div>

对一些地方进行的一些研究表明,IE并不喜欢褪色课程。所以我尝试删除它但没有带来任何变化。

任何可以提供帮助的人

1 个答案:

答案 0 :(得分:0)

您尚未设置任何data-attributes来调用模式:href="#contact-admin" data-toggle="modal"

你的href看起来应该是这样的。

<a class="btn btn-link open-modal" href="#" data-toggle="modal" data-target="#contact-admin">Have a question?</a>

工作示例:

&#13;
&#13;
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<a class="btn btn-link open-modal" href="#contact-admin" data-toggle="modal">Have a question?</a>

<div tabindex="-1" class="modal fade contact-admin" id="contact-admin" role="dialog" aria-labelledby="mySmallModalLabel">
  <div class="modal-dialog modal-sm" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <span class="text-center"><strong>Please contact the admin via email</strong></span>
        <br>
        <br>
        <address>
          <strong>Name:</strong> Mr Saxena <br>
          <strong>Email:</strong> saxena@gmail.com
        </address>
      </div>
      <div class="modal-footer">
        <button class="btn btn-default no" type="button" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
&#13;
&#13;
&#13;