Question

我有一个通过AJAX调用引入的字段：

<select id="selection">
    <option value="foo">bar</option>
    <option value="baz">bat</option>
</select>

我正在尝试使用.on()在字段更改时将所选元素传递给函数：

$(document).on("change", "#selection", function(){ doStuff(jQuery(this).filter("option:selected")); });

function doStuff(selection)
{
    alert(selection.text());
}

当元素发生变化时，我只收到空白警报对话框。在alert(selection.text()上放置一个断点给了我：

selection: e.fn.e.init[0]
    context: HTMLSelectElement
        0: HTMLOptionElement
        1: HTMLOptionElement
    length: 0
    prevObject: e.fn.e.init[1]
    selector: ".filter(option:selected)"
    __proto__: Object[0]

HTMLOptionElements中的一个将具有选定的：true值。我只是不知道如何使用.on()从所选元素中获取文本（我的示例中的bar或bat）。

我通常会做$('#selection option:selected').text();，但.on（）正在玩我各种各样的游戏:(

Answer 1

哇，那里......为什么不呢

$(function() {
  $('#selection').on('change', function() {
    alert($(this).children(':selected').text());
  });
});

Answer 2

无需做任何复杂的事情 - 您可以直接使用JavaScript：

this.options[this.selectedIndex].text

Answer 3

.filter用于从第一组生成结果子集，但第一组不包括选项，因为$（this）指的是已更改的选择。

您需要在更改处理程序中使用.children或.find来查找：selected选项。

如何在使用.on（）？</option>时获取：选择的表单<option>

3 个答案: