簡體   English   中英

如何從Bootstrap 4的下拉菜單中獲取價值?

[英]How to get value from dropdown menu in bootstrap 4?

<li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle toggle2" href="#" id="navbarDropdown2" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    Material Type
                </a>


                <div class="dropdown-menu menu2" aria-labelledby="navbarDropdown2">
                    <a class="dropdown-item">Mud</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item">Cloth</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item">Thread</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item">Jute</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item">Cotton</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item">Cane</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item">Bamboo</a>
                </div>
            </li>

選擇如下所示后,能否從菜單中獲取值?

var email=document.getElementById('signUpEmail').value;

這樣我就可以在ajax中使用此變量。

編輯
正如@Timir建議使用select一樣,菜單看起來像

<li class="nav-item">
<select class="custom-select custom-select-lg mb-3" id="mydropdown">
  <option selected>Material Type</option>
  <option value="Mud">Mud</option>
  <option value="Cloth">Cloth</option>
  <option value="Thread">Thread</option>
  <option value="Jute">Jute</option>
  <option value="Cotton">Cotton</option>
  <option value="Can">Can</option>
  <option value="Bamboo">Bamboo</option>
</select>
</li>

選擇如下所示后,能否從菜單中獲取值?

不,沒有輸入可檢索其值。 但您可以在鏈接內獲得文本,例如

$('.menu2 a.dropdown-item').on('click', function(){
    $(this).text()
});

把它變成一個選擇,給它一個ID,然后說: $(“#mydropdown option:selected”).val();

基本上所有JavaScript都有解決方法。 包括這個。 在不使用JQuery的情況下,您可以添加事件偵聽器,也可以在每個選項或錨標記中添加一個onlick。 當您單擊下拉菜單並設置選項時,它將調用設置變量的函數。 因此,即使沒有輸入框,您也只是在設置全局變量。 然后,您可以將該變量用作表單的一部分,或者計划使用它。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM