顯示下拉列表

我的項目要求是在點擊按鈕顯示警告或對話框，在該警報，顯示下拉列表中的一些值，選擇下拉列表值和使用HTML將它保存在數組列表中。我試過this但它不工作。警報對話框應該像下圖一樣。顯示下拉列表

<html lang="en"> 
<head> 
    <title></title> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
<link rel="stylesheet" href="/resources/demos/style.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
</head> 
<body> 

<a data-target="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

<div class="modal fade hide" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
    <select> 
       <option>test</option> 
       <option>test</option> 
       <option>test</option> 
       <option>test</option> 
       <option>test</option> 
      </select> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-primary">Save changes</button> 
    </div> 
</div> 
</body> 
</html>

來源

2017-06-06 Kishor N R

你有bootstrap集成你的代碼？ – hallleron

在您提供的Demo鏈接中沒有任何問題。我可以理解的是，由於試圖模擬演示鏈接中的代碼，您可能會在不知不覺中推出一些錯誤。發佈您的代碼，以便它會很容易幫助 – Sumit

是的，我已經將<鏈接相對=「樣式的」 href =「https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min。 css「integrity =」sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va + PmSTsz/K68vbdEjh4u「crossorigin =」anonymous「> 和 –

試試這個代碼...

<a data-target="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 

    <div class="modal-dialog"> 
    <div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
    <select> 
       <option>test</option> 
       <option>test</option> 
       <option>test</option> 
       <option>test</option> 
       <option>test</option> 
      </select> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-primary">Save changes</button> 
    </div> 
    </div> 
    </div> 
</div>

https://codepen.io/chandrashekhar/pen/yXNBmQ?editors=1100

這裏是你已經添加隱藏類模態參考

的鏈接，也錯過了一些代碼嘗試這個工程..

來源

2017-06-06 09:50:19

感謝它的工作... –

喜嘗試使用http://bootboxjs.com/

Bootbox配備了模態隨着選擇下拉嘗試使用它。

希望這有助於

來源

2017-06-06 09:15:36

我都試過，但沒有奏效 –

你沒有看到一個彈出up？（或）彈出不保存更改按鈕點擊關閉？什麼是確切的問題？你能解釋一下嗎？ –

我看不到彈出。 –

顯示下拉列表

回答

相關問題