Modal將不會顯示快速應用程序

我已經在html中構建了一個頁面，並使用jQuery和Bootstrap在按鈕點擊時顯示的模式。當我的桌面上有文件（css，js，fonts，index.html）時，一切都按預期工作。Modal將不會顯示快速應用程序

當我進入我的Express應用程序併爲相同的html內容創建新視圖並更新鏈接以反映我的應用程序中的鏈接時，我得到了一個有點失敗的頁面。

據我可以告訴頁面看起來90％相似。 Bootstrap JS和CSS是絕對加載的，因爲我有樣式和摺疊導航欄。 jQuery肯定會加載，因爲我在控制檯中有一個$ hook（並且我看到該文件正在被加載資源中）。

我沒有任何控制檯錯誤（JS或CSS），我知道如果我禁用CSS，我的內容坐在屏幕中間。

我已經嘗試了類似的代碼在不同的網頁上設置完全相同的方式，它似乎工作正常。有人知道我沒有或可能會提供幫助的東西嗎？

<a href=""><i class="fa fa-envelope fa-2x" data-target="#mymodal" data-toggle="#mymodal"></i><br>SEND TEXT</a> 
     <br> 

     <!-- insert modal --> 
     <div class="modal fade share-modal" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> 
      <div class="modal-dialog modal"> 
       <div class="modal-content"> 
       <br> 
        <form> 
         <div class="form-group"> 
          <input type="text" class="form-control" id="guestphonenumber" placeholder="PLACEHOLDER HERE"> 
         </div><!-- form-group --> 

         <div class="form-group"> 
          <select class="form-control"> 
           <option>Unlimited</option> 
          </select> 
         </div><!-- form-group --> 
        </form> 
       </div> 
      </div> 
     </div>

我在SO和其他一些論壇上挖了一下。我確定我只包含bootstrap資源一次。此外，我檢查了快遞正確地提供了文件，並且所有正確的文件都已到位。

來源

2015-10-07 Neurax

'數據切換= 「＃mymodal」刪除modal類'應該是'數據 - toggle =「模態」 – Shehary

情侶修復

要觸發模式的，你需要包括一個鏈接或按鈕。在觸發元素的標記可能是這樣的：

<a href="#" 
data-toggle="modal" 
data-target="#mymodal">open Modal</a>

通知link元素有兩個自定義數據屬性：data-toggle和data-target。切換告訴Bootstrap做什麼，目標告訴Bootstrap哪個元素打開。所以每當點擊這樣的鏈接時，就會出現一個id爲「mymodal」的模式。

在你的代碼，以便更改data-toggle="#mymodal"到data-toggle="modal"和移動data-target="#mymodal" data-toggle="modal"爲<a href="">

和<div class="modal-dialog modal">

Fiddle

來源

2015-10-07 02:50:48 Shehary

輝煌。非常感謝您解決頭部撞擊錯誤。 – Neurax

Modal將不會顯示快速應用程序

回答

相關問題