获取选定的选项 jQuery - JavaScript

当你需要从一个下拉列表或一个多选框中获取选中的选项时，你需要使用 jQuery 和 JavaScript 来实现。

以下是如何获取选定的选项的步骤：

1. 使用 jQuery 选择器来选择元素

首先，使用 jQuery 选择器来选中下拉列表或多选框元素。

var selectedOptions = $('#mySelect option:selected');

在以上代码中，#mySelect 是你要获取选项的下拉列表或多选框的 ID。option:selected 部分是 jQuery 选择器用于选中选中的选项的方式。

2. 使用 jQuery .each() 函数来遍历选项

接下来，使用 jQuery 的 .each() 函数来遍历选中的选项。

selectedOptions.each(function() {
  var value = $(this).val();
  var text = $(this).text();
  // do something with value and text
});

在以上代码中，selectedOptions 是第一步中选中的选项。.each() 函数中的匿名函数将在每个选项上执行。$(this) 将是当前循环中的选项元素。

使用 $(this).val() 来获取当前选项的值，使用 $(this).text() 来获取当前选项的文本。

你可以在循环中做任何你想做的事情。例如，将值添加到数组中，将文本显示在网页上等等。

3. 获取多选框的选项

如果你要获取多选框的选中选项，则需要使用类似以下代码的方式：

var selectedOptions = $('#myCheckbox input:checked');

在以上代码中，#myCheckbox 是你的多选框的 ID。input:checked 是 jQuery 选择器用于选中选中的多选框的选项。

完整代码

这里是完整的代码示例：

// 获取下拉列表的选项
var selectedOptions = $('#mySelect option:selected');

selectedOptions.each(function() {
  var value = $(this).val();
  var text = $(this).text();
  // do something with value and text
});

// 获取多选框的选项
var selectedCheckboxOption = $('#myCheckbox input:checked');

selectedCheckboxOption.each(function() {
  var value = $(this).val();
  var text = $(this).parent().text();
  // do something with value and text
});

以上代码使用了 jQuery 和 JavaScript 来获取选中的选项，可以方便地应用于网页中。