html - 下拉 react 不适用于 Bootstrap v4

标签 html css twitter-bootstrap bootstrap-4

我有一个表格,在最后一列中有以下下拉列表:

<td>
  <div>
    <button aria-expanded="false" aria-haspopup="true" data-toggle="dropdown" id="dropdownMenu2" type="button">Dropdown</button>
    <div aria-labelledby="dropdownMenu2">
      <button type="button">Action</button> <button type="button">Another action</button> <button type="button">Something else here</button>
    </div>
  </div>
</td>

当我点击下拉菜单时它没有打开,可能是什么问题?

会不会是ariadata属性引起的?

最佳答案

我认为 className 属性在这里不起作用。如果您将“className”替换为“class”并仅添加 bootstrap,它就可以工作。

<html>
<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" crossorigin="anonymous">
  <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
</head>

<body>
  <td>
    <div class="dropdown">
      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Dropdown
      </button>
      <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
        <button class="dropdown-item" type="button">Action</button>
        <button class="dropdown-item" type="button">Another action</button>
        <button class="dropdown-item" type="button">Something else here</button>
      </div>
    </div>
  </td>
</body>
</html>

关于html - 下拉 react 不适用于 Bootstrap v4,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44290229/

相关文章:

html - 在流体布局中将容器 ul/div 居中

html - Bootstrap 导航栏右侧的语言选择器

javascript - 解析json条目列表并在html中垂直填充显示

javascript - 如何阻止该网站并为不使用 JavaScript 的用户显示横幅?

css - 移动像素尺寸(使用 Chrome 模拟器)

javascript - 如何调整 Grecaptcha v2 iframe 的大小

html - CSS 没有覆盖 Bootstrap

javascript - 如何使用 Bootstrap 切换被单击的元素并隐藏所有其他元素?

html - 为什么我的背景图片不显示

html - Chrome 中 CSS3 动画无法正常返回 0%