Question

我有一个模态窗口（使用bootstrap），有一个关闭按钮。在大多数浏览器中，模态窗口可以打开和关闭。但是，在Internet Explorer中，存在一个问题。我们可以很好地打开模态窗口，然后将其关闭......但是如果我们再尝试打开它，它就不会。

大多数javascript功能都在bootstrap中。下面是打开按钮的html [我相信data-toggle =“modal”和data-target =“＃exampleModal”是打开窗口的关键] ...

    <a href="javascript:void(0)" id="navdemo" data-toggle="modal" data-target="#exampleModal">Get The Demo</a>

...和模态窗口开始的html，关闭按钮[注意id =“exampleModal”告诉打开哪个窗口。并且数据解散告诉关闭“模态”......

<div class="modal fade show" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="padding-right: 17px; display: block;">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <!-- CLOSE BUTTON -->
            <div class="row at-modal-close-box">
                <a href="#" data-dismiss="modal" aria-label="Close">
                    <img src="https://www.amazingdg.com/_dev/temp/images/modal-close-btn.svg" alt="Close Demo Form">
                </a>
            </div>
    ...

您可以在此处查看该页面： https://www.amazingdg.com/_dev/temp/

注意：当我再次单击打开按钮时，IE控制台中出现错误... Object.keys：参数不是Object。注意：第一次打开模态窗口时不会发生此错误。不确定如何解决它......

----------------------------------------------- ----

我试图删除淡入淡出类...使模态窗口显示表单中的所有隐藏元素（必填字段，成功发送消息等）

if ($.browser.msie) {
 $("#exampleModal").removeClass("fade");
}

----------------------------------------------- ----

我尝试使用IE媒体查询更改淡入淡出转换（IE不支持）。这消除了淡入淡出，但没有解决问题。

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */
    .fade {
        transition:none !important;
    }
}

Answer 1

我在IE上遇到了类似的问题，通过执行以下操作解决了这个问题：

每当你打开模态时，使用：

modal.element.modal();

发送一个空对象，如下所示：

modal.element.modal({});

这解决了我在IE中的问题（不需要弄乱淡入淡出类）并且没有改变其他浏览器中的行为！

Answer 2

删除在IE中无法使用的淡入淡出类

if ($.browser.msie) {
 $("#exampleModal").removeClass("fade");
}

Answer 3

我正面临着一个非常简单的解决方法。

您可以在调用的函数中使用jQuery来简单地切换模式：

 <div class="scoreboard">
     <div class="center">
        <p>Player: 1 Points: 0</p>
        <p>Player: 2 Points: 0</p>
        <p>Player: 3 Points: 0</p>
        <p>Player: 4 Points: 0</p>
        </div>
 </div>

Internet Explorer中的Open-Close Modal问题

----------------------------------------------- ----

----------------------------------------------- ----

3 个答案: