使用 jQuery 在 HTML select 中获取 selected 选项的文本

Question

我下面有一个html。如何获取第二个标签的文本，即 "Frame Size"。

<div class="productOptionViewSelect">
    <div class="selector fixedWidth" id="uniform-08876c63593c0928fefc45101870c7b0"><span style="-webkit-user-select: none;">Frame Size</span><select class="validation" id="08876c63593c0928fefc45101870c7b0" name="attribute[1318]">
        <option value="">-- Please Select --</option>

                    <option value="2527">Frame Size</option>
                    <option value="206">10x15 (4x6 in)</option>
            </select></div>
</div>


<div class="productOptionViewSelect">
        <div class="selector fixedWidth" id="uniform-08876c63593c0928fefc45101870c7b0"><span style="-webkit-user-select: none;">Frame Size</span><select class="validation" id="08876c63593c0928fefc45101870c7b0" name="attribute[1318]">
            <option value="">-- Please Select --</option>

                        <option value="252">Photo Size</option>
                        <option value="206">10x20 (4x6 in)</option>
                </select></div>
    </div>

我可以通过

得到 select 的值

$('.productOptionViewSelect').find('select').val();

但这不能满足我的要求。任何选项都可以 selected 所以我不能在上面使用 jQuery.

Edit

如果我用不同的选项集两次使用相同的块，而不是如何获得每个块的第二个选项？在这种情况下，我想要 Frame Size 和 Photo Size 但在每个事件中只调用它 returns Frame Size . 任何帮助将不胜感激。

Answer 1

如果要获取选中选项的文本，需要获取选中选项的jquery对象，然后使用.text()或.html()获取其中的内容:

$('.productOptionViewSelect option:selected').text();

Answer 2

使用这个

$('.productOptionViewSelect').find('select option:selected').text()

它将为您提供 <option>

内的文本

Answer 3

尝试

$('.productOptionViewSelect select').find('option:selected').text();

Answer 4

您不能像这样使用选择器：

$('.productOptionViewSelect option:eq(1)')

因为在这个结果集中只有一个选项会有索引 1 - 第二个 .productOptionViewSelect div 中第二个选项的索引将得到等于索引的索引第一个 div 加上 2 中的最后一个选项。

因此你应该迭代这两组选项并使用 .text():

$('.productOptionViewSelect').each(function(){
    console.log($(this).find('option:eq(1)').text());
});

输出：

Frame Size
Photo Size

Answer 5

$("select.validation option:eq(1)").text();

使用 jQuery 在 HTML select 中获取 selected 选项的文本

Get selected option's text in an HTML select using jQuery

javascript

jquery

select

selectedtext