Get current value selected in dropdown using jQuery

I have a set of dynamically generated dropdown boxes on my page. basically I clone them using jQuery. now I want to capture the value selected on each dropdown on change event.

开发者_JAVA百科

I tried something like this which did not work.

$('._someDropDown').live('change', function(e) {
            //debugger;
            var v = $(this);
            alert($(this + ':selected').val());
            alert($(this).val());
        });

How do I get it done?

---

To get the text of the selected option

$("#your_select :selected").text();

To get the value of the selected option

$("#your_select").val();

---

This is what you need :)

$('._someDropDown').live('change', function(e) {
    console.log(e.target.options[e.target.selectedIndex].text);
});

For new jQuery use on

$(document).on('change', '._someDropDown', function(e) {
    console.log(this.options[e.target.selectedIndex].text);
});

---

$("#citiesList").change(function() {
    alert($("#citiesList option:selected").text());
    alert($("#citiesList option:selected").val());              
});

citiesList is id of select tag

---

Check it Out-->

For getting text

$("#selme").change(function(){
 $(this[this.selectedIndex]).text();
});

For getting value

$("#selme").change(function(){
 $(this[this.selectedIndex]).val();
});

---

You can try:

$("._someDropDown").val();

---

To get the value of a drop-down (select) element, just use val().

$('._someDropDown').live('change', function(e) {
  alert($(this).val());
});

If you want to the text of the selected option, using this:

$('._someDropDown').live('change', function(e) {
  alert($('[value=' + $(this).val() + ']', this).text());
});

---

try this...

$("#yourdropdownid option:selected").val();

---

This is actually more efficient and has better readability in my opinion if you want to access your select with this or another variable

$('#select').find('option:selected')

In fact if I remember correctly phpStorm will attempt to auto correct the other method.

---

In case you want the index of the current selected value.

$selIndex = $("select#myselectid").prop('selectedIndex'));

---

The options discussed above won't work because they are not part of the CSS specification (it is jQuery extension). Having spent 2-3 days digging around for information, I found that the only way to select the Text of the selected option from the drop down is:

{ $("select", id:"Some_ID").find("option[selected='selected']")}

Refer to additional notes below: Because :selected is a jQuery extension and not part of the CSS specification, queries using :selected cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. To achieve the best performance when using :selected to select elements, first select the elements using a pure CSS selector, then use .filter(":selected"). (copied from: http://api.jquery.com/selected-selector/)

---

You can also use :checked

$("#myselect option:checked").val(); //to get value

or as said in other answers simply

$("#myselect").val(); //to get value

and

$("#myselect option:checked").text(); //to get text