小编bat*_*cat的帖子

导入 Bootstrap 模态后下拉菜单不起作用

我有一个带有下拉菜单的标题。如果我点击,我会看到菜单。一切工作都很完美。这是 HTML: 在此输入图像描述

我从引导程序导入模式的另一个页面,当我单击下拉菜单时没有任何反应。在控制台中它没有显示任何错误,但我不知道为什么,我有两个事件: 在此输入图像描述

如果我从 Js 中删除导入。文件,它将完美地工作:

import { Modal } from 'bootstrap';
Run Code Online (Sandbox Code Playgroud)

应用程序.js

const bootstrap = require('bootstrap/dist/js/bootstrap.bundle');
Run Code Online (Sandbox Code Playgroud)

联系.js

import { Modal } from 'bootstrap';


window.addEventListener("DOMContentLoaded", () => {
if (document.getElementById('emailHasBeenSent') !== null && document.getElementById('emailHasBeenSent').value) {
    const modal = new Modal(document.getElementById('contactUsModal')),
        closeModalBtn = document.querySelector('.contact--modal-close-btn');

    modal.show();

    closeModalBtn.addEventListener('click', e => {
        modal.hide();
    })
}});
Run Code Online (Sandbox Code Playgroud)

Bootstrap 的模态似乎“取消”onClick 事件下拉列表。类名保留在“btn dropdown-toggle”上,而不是“btn dropdown-toggle show ”上。你能帮我看看问题出在哪里吗?

javascript drop-down-menu bootstrap-modal webpack

9
推荐指数
1
解决办法
1358
查看次数