跳到主要内容

jQuery如何找到所有 HTML select 标签的选中项?

参考答案:

你可以使用 jQuery 的 :selected 选择器来找到所有 HTML select 标签的选中项。以下是一个示例代码:

$('select option:selected').each(function() {
    var value = $(this).val(); // 获取选中项的值
    var text = $(this).text(); // 获取选中项的文本
    
    console.log('Value: ' + value + ', Text: ' + text);
});

在这段代码中,$('select option:selected') 会选择所有选中的 option 元素。然后,.each() 函数会对每个选中的 option 元素进行迭代。在每次迭代中,你可以使用 $(this).val() 来获取选中项的值,使用 $(this).text() 来获取选中项的文本。

如果你只想获取特定 select 标签的选中项,你可以给 select 标签添加一个类或 ID,然后在选择器中指定这个类或 ID。例如,如果你的 HTML 代码如下:

<select class="my-select">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3" selected>Option 3</option>
</select>

<select class="my-select">
    <option value="4" selected>Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>

你可以使用以下代码来找到所有类为 my-selectselect 标签的选中项:

$('.my-select option:selected').each(function() {
    var value = $(this).val();
    var text = $(this).text();
    
    console.log('Value: ' + value + ', Text: ' + text);
});

这段代码会输出:

Value: 3, Text: Option 3
Value: 4, Text: Option 4