使用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.

我的页面上有一组动态生成的下拉框。基本上我用jQuery克隆它们。现在我想捕获更改事件的每个下拉列表中选择的值。

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?

我该如何完成？

10 个解决方案

#1

This is what you need :)

这就是你需要的:)

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

For new jQuery use on

对于新的jQuery使用

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

#2

To get the text of the selected option

获取所选选项的文本

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

To get the value of the selected option

获取所选选项的值

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

#3

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

citiesList is id of select tag

citiesList是select标签的id

#4

Check it Out-->

检查出来 - >

For getting text

获取文字

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

For getting value

为了获得价值

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

#5

You can try:

你可以试试：

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

#6

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

要获取下拉（选择）元素的值，只需使用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());
});

#7

try this...

尝试这个...

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

#8

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.

事实上，如果我没记错的话，phpStorm将尝试自动更正其他方法。

#9

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:

上面讨论的选项不起作用，因为它们不是CSS规范的一部分（它是jQuery扩展）。花了2-3天的时间挖掘信息，我发现从下拉列表中选择所选选项的文本的唯一方法是：

{ $("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/)

请参阅下面的其他说明：因为：selected是jQuery扩展而不是CSS规范的一部分，使用：selected的查询无法利用本机DOM querySelectorAll（）方法提供的性能提升。要在使用时获得最佳性能：选择选择元素，首先使用纯CSS选择器选择元素，然后使用.filter（“：selected”）。（复制自：http：//api.jquery.com/selected-selector/）

#10

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

如果您想要当前所选值的索引。

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

#1