如何使用 JavaScript 獲取 Bootstrap 下拉值

Question

我試圖在提交表單時獲取下拉值。

下面是我的 HTML 和 javascript 代碼

 $(document).ready(function() { $("#gender li").click(function() { value = $(this).attr("value"); gender = $("#gendervalue").val(value); //alert(gender); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown"> Gender <span class="caret"></span> </button> <ul id="gender" class="dropdown-menu"> <li><a href="#">Select Gender</a></li> <li><a href="#">Male</a></li> <li><a href="#">Female</a></li> </ul> <input type='hidden' name="gendervalue" id="gendervalue"> </div>

當我提交表單時，我得到了性別值 [object object]

Answer 1

我希望它能幫助你。 試試這段代碼。 我在代碼注釋中添加了解釋。 噸

<select id="gender">
<option>Select</option> 
<option value="Male">Male</option>  
<option value="Female">Female</option>  

<script type="text/javascript">
    $(document).ready(function () {
        //on change gender value (input value) run this function
        $("#gender").change(function() { 

            //get the value of selected item and store in gender variable
            gender = $("#gender").val();

            //store the value in gender input field. (you can change input type="")
            $("#gendervalue").val(gender);
        });
    });
</script>