javascript - Bootstrap Modal 仅触发 Backdrop

Question

我几个小时以来一直试图找到解决方案，但由于某种原因， Bootstrap 模式没有显示，只出现了背景。

我已检查代码以匹配正确的语法，我已包含正确的文件并按正确的顺序。我从我的另一个网站上获取了这些文件，该网站运行良好，但在这里不行。我只有一个其他 js 文件，我也尝试禁用它。

当我单击该按钮时，我可以在控制台中看到 bootstrap.js 将类应用于正文和背景元素，但不应用于 .modal 元素。就好像根本找不到那个类一样。代码如下:

<button  type="button" data-toggle="modal" data-target="#1"><i class="fa fa-clone"></i></button>

和

<div id="1" class="modal fade">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><h4>Dhananjay</h4></h4>
        </div>
        <div class="modal-body">
           <table class="table table-hover">
                <tr class="active">
                        <th>Order ID</th><th>Source</th><th>Destination</th><th>Date</th><th>Cost</th><th></th>
                </tr>
                                    <tr>
                    <td>1</td><td>110034</td><td>113344</td><td> Thursday 19th November 2015</td><td>10</td> <!-- Change ID -->
                </tr>
                                            <tr>
                    <td>2</td><td>110034</td><td>205263</td><td> Monday 7th December 2015</td><td>20</td> <!-- Change ID -->
                </tr>
                                            <tr>
                    <td>3</td><td>110034</td><td>205263</td><td> Monday 7th December 2015</td><td>20</td> <!-- Change ID -->
                </tr>
                                            <tr>
                    <td>4</td><td>110034</td><td>205263</td><td> Monday 7th December 2015</td><td>20</td> <!-- Change ID -->
                </tr>
                                            <tr>
                    <td>5</td><td>110034</td><td>205263</td><td> Monday 7th December 2015</td><td>20</td> <!-- Change ID -->
                </tr>
                                        </table>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>

Answer 1

您是否尝试过将 ID 更改为更有效的 ID 名称？例如“#mymodal”。也许你可以尝试看看这个valid ID names