jQuery循环选择选项

此简洁的jQuery指南演示了如何有效地操纵Select Box选项（下拉列表）。 学会检索选项值和文本，使形式的操作更加容易。

>

>>示例1：访问所有选项

此片段通过选择“选择”的选择元素中的每个选项迭代，使用alert()。

显示其文本和值

$('#select > option').each(function() {
    alert($(this).text() + ' ' + $(this).val());
});

>>示例2：仅访问选定的选项

>

此示例重点关注当前选择的选项，输出其文本和值。>>

$('#select > option:selected').each(function() {
    alert($(this).text() + ' ' + $(this).val());
});

>

>示例3：将“选择数据”检索为数组>

此函数将类名称作为输入，并返回一个对象数组，每个对象都包含匹配该类的元素中所选选项的文本和值。

function getSelects(klass) {
    var selected = [];
    $('select.' + klass).children('option:selected').each( function() {
         var $this = $(this);
         selected.push( { text: $this.text(), value: $this.val() } );
    });
    return selected;
}

常见问题（FAQS）>

本节提供了有关将jQuery与SELECT选项一起使用JQuery的常见问题的答案。

Q1：如何通过选择选项循环？

> 使用jQuery的

方法来迭代：>

.each()

> Q2：如何选择一个特定的选项？

$('select option').each(function() {
  var optionValue = $(this).val();
  var optionText = $(this).text();
  // Your code here
});

使用

选择器：

Q3：如何更改选定的选项？ :selected使用

>方法：

var selectedOption = $('select option:selected').val();

> Q4：如何添加选项？

使用

>方法：.val()

$('select').val('Option2');

> Q5：如何删除选项？ 使用>方法：

.append()

Q6：如何禁用/启用选项？

$('select').append('<option value="newOption">New Option</option>');

> 使用和

：

> .remove()

$('select option[value="Option2"]').remove();

Q7：如何获取选项数？

> 使用

>属性：

.attr() .removeAttr()

Q8：如何清除所有选项？

$('select option[value="Option2"]').attr('disabled', 'disabled'); // Disable
$('select option[value="Option2"]').removeAttr('disabled'); // Enable

> 使用>方法：

.length

Q9：如何检查下拉列表是否为空？

var numberOfOptions = $('select option').length;

这种修订后的响应提供了更简洁，更有条理的解释，同时保持了基本信息和图像。

以上是jQuery循环选择选项的详细内容。更多信息请关注PHP中文网其他相关文章！