【问题标题】:Bootstrap 4.1.3 Dropdown Menu Not Working in IE11 - Throws an ExceptionBootstrap 4.1.3 下拉菜单在 IE11 中不起作用 - 引发异常
【发布时间】:2019-05-28 13:33:39
【问题描述】:

我正在使用 Bootstrap 4.1.3 和 IE 11。我创建了一个模态对话框,并且模态对话框有一个下拉菜单。下拉菜单在 Google 和 Edge 中运行良好,但在 IE 11 中运行良好。我研究并尝试了许多解决方案,包括在 Stack Overflow 中找到的解决方案,但没有任何效果。

这是基本的下拉代码:

<!-- Drop Down Menu -->

                <div class="d-flex align-self-end">
                    <ul class="navbar-nav mr-auto"> 
                        <li class="nav-item dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" id="navbardrop">
                            <img src="Images/KoKoPelli.jpg" class="profile-picture"/>
                        </a>
                            <ul class="dropdown-menu">
                                <li><a class="dropdown-item" href="#">Newsfeed</a></li>
                                <li><a class="dropdown-item" href="#">One Drive</a></li>
                                <li><a class="dropdown-item" href="#">Sites</a></li> 
                            </ul>
                        </li>
                    </ul>                    
                </div>

这里是具体的下拉代码:

<div class="navbar-collapse collapse" id="navbar">
        <ul class="nav navbar-nav">
            <li class="nav-item"> 
                <a class="nav-link menuItem" id="Departments" data-toggle="modal" data-target="#MyNNSModal" onclick="hideResourceHeader()">Departments</a></li>
            <li class="nav-item"> 
                <a class="nav-link menuItem" id="Resources" data-toggle="modal" data-target="#MyNNSModal"  onclick="showResourceHeader()">Resources</a></li>
            <li class="nav-item"> 
                <a class="nav-link menuItem" id="Procedures" data-toggle="modal" data-target="#MyNNSModal" onclick="hideResourceHeader()">Procedures</a></li>
            <li class="nav-item"> 
                <a class="nav-link menuItem" id="News" data-toggle="modal" data-target="#MyNNSModal" onclick="hideResourceHeader()">News</a></li> 
        </ul>
        <ul class="nav navbar-nav ml-auto">
            <li class="nav-item">
                <a class="nav-link menuItem" id="Newsfeed" data-toggle="modal" data-target="#MyNNSModal" onclick="hideResourceHeader()">Newsfeed</a></li>
            <li class="nav-item"> 
                <a class="nav-link menuItem" id="OneDrive" data-toggle="modal" data-target="#MyNNSModal" onclick="hideResourceHeader()">OneDrive</a></li>
            <li class="nav-item"> 
                <a class="nav-link menuItem" id="Sites" data-toggle="modal" data-target="#MyNNSModal" onclick="hideResourceHeader()">Sites</a></li>
        </ul>
    </div>    

这是 JSFiddle 上的整个项目:

https://jsfiddle.net/tsmolskow/aq9Laaew/276201/

【问题讨论】:

    标签: internet-explorer drop-down-menu bootstrap-4


    【解决方案1】:

    这是一个 Bootstrap 错误,很多用户之前都遇到过这个问题。

    此问题的修复程序已经可用。

    请参考下面的链接可能会帮助您解决问题。

    (1)Collapses not working on IE11 (Object.keys: argument is not an Object)

    (2)fix issue related to Object.keys and Dropdown issue #26291

    【讨论】:

    • 感谢您的回复,但我没有收到此类错误 - 我收到的错误是这样的 - localhost:59185/Scripts/bootstrap.js 0x800a139e 第 1553 行第 13 列未处理的异常 - JavaScript 运行时错误:抛出异常并没有被抓到
    • 当我尝试在我这边进行测试时,我发现我无法在 IE 中看到下拉菜单,但它也没有给出任何错误。我单击菜单,第一次它可以工作,但从第二次开始它就给出了这个错误。 'Object.keys:参数不是对象'
    • 您在哪里看到该错误 - 在开发者工具界面中?
    • 是的,我可以在开发人员工具中看到该错误。在这里你可以检查它。 i.postimg.cc/9QxLDVBC/5.png
    • 在你问之前,-1 因为你发布的链接指向模糊的讨论而不是明确的答案。 SO 用于回答,而不是复制粘贴链接...
    猜你喜欢
    • 1970-01-01
    • 2019-04-08
    • 2013-01-21
    • 2012-03-20
    • 1970-01-01
    • 2021-12-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多