如何在jQuery中获取选择框的值并提醒该值？

Question

I have written a jquery code but it is not working for getting the selected option value of a select box. it is alerting the message box not the value which is picked from the select box.

<div class="form-group col-md-12 padd">
    <label for="exampleInputEmail1">Skill level</label>
    <select name="visa_status" id="visa_status" class="dropselectsec1">
        <option value="bfdgdfgdf">bfdgdfgdf</option>
        <option value="fdfdggf">fdfdggf</option>
        <option value="dfdf">dfdf</option>
    </select>
</div>

This is the select box.

jquery code :

<script src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("input").change(function(){
            var startDate = $("#start-date").val();
            var endDate = $("#end-date").val();
            $(".rentdate").html("Rental Date<span> From:"+startDate+" To:"+endDate);
        });

        $("select").change(function(){
            var selectedCountry = $(".dropselectsec1 option:selected").val();
            alert(selectedCountry);
        });
    });
</script>

Answer 1

Use $(this) instead.

$("select").change(function(){
    var selectedCountry = $(this).val();
    alert(selectedCountry);
});

$(this) points to the element on which you're binding the event handler. In your case it's selection box.

Answer 2

 $('select').change(function(){ var selectedCountry = $(this).val(); console.log(selectedCountry); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="form-group col-md-12 padd"> <label for="exampleInputEmail1">Skill level</label> <select name="visa_status" id="visa_status" class="dropselectsec1"> <option value="bfdgdfgdf">bfdgdfgdf</option> <option value="fdfdggf">fdfdggf</option> <option value="dfdf">dfdf</option> </select> </div> 

Answer 3

Please refer following jquery code. ".val()" function will useful to get value of selected dropdown.

$(document).ready(function() {
    $("#visa_status").change(function(){
        var selectedCountry = $(this).val();
        alert(selectedCountry);
    });
});

Answer 4

simply use this

<div class="form-group col-md-12 padd">
                                  <label for="exampleInputEmail1">Skill level</label>
                                    <select name="visa_status" id="visa_status" class="dropselectsec1">

                                                    <option value="bfdgdfgdf">bfdgdfgdf</option>
                                                    <option value="fdfdggf">fdfdggf</option>
                                                    <option value="dfdf">dfdf</option>
                                                </select>
                                </div>

                                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script type="text/javascript">

$("#visa_status").change(function(){
    var selectedCountry = $(".dropselectsec1 option:selected").val();
    alert(selectedCountry);
});


</script>